/* Terms & FAQs page (App\Services\PolicyPage): the site's green, gold and cream; labels in frosted glass. */
.pl { --g: var(--ms-green); --g-deep: var(--ms-green-deep); --gold: var(--ms-gold); --gold-l: var(--ms-gold-l); --cream: var(--ms-cream); --line: var(--ms-line); --mut: var(--ms-mut); --ink: var(--ms-ink); --hd: var(--ms-font-head); color: var(--ink); }
.pl *, .pl *::before, .pl *::after { box-sizing: border-box; }
.pl a { text-decoration: none !important; }
.pl h1, .pl h2, .pl h3 { margin: 0; letter-spacing: var(--ms-ls-head); }
.pl p { margin: 0; padding: 0; }
.pl-ico { width: 18px; height: 18px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pl-wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.cms-sec.cms-sec--policy_page { padding: 0 !important; background: #fff; }
.pl-kicker { display: block; margin-bottom: 10px; font-size: calc(12px * var(--ms-k-text)); font-weight: 600; letter-spacing: var(--ms-kicker-ls); text-transform: uppercase; color: var(--gold); }
.pl .cms-sec__btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.pl .cms-sec__btn .pl-ico { width: 16px; height: 16px; }

/* frosted glass labels on pictures */
.pl-glass { color: #fff; background: var(--ms-glass-bg); border: 1px solid var(--ms-glass-border); -webkit-backdrop-filter: var(--ms-glass-blur); backdrop-filter: var(--ms-glass-blur); box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 10px 30px rgba(0,0,0,.14); }

/* A: big picture, title and key points (room at the top for the site's header over it) */
.pl-hero { position: relative; overflow: hidden; color: #fff; background: var(--g-deep); }
.pl-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center 55%; }
.pl-hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(var(--ms-shade-rgb),.62) 0%, rgba(var(--ms-shade-rgb),.35) 40%, rgba(var(--ms-green-deep-rgb),.96) 100%); }
.pl-hero-in { position: relative; z-index: 2; padding-top: 190px; padding-bottom: 60px; }
.pl-chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px 8px 8px; font-size: calc(12.5px * var(--ms-k-text)); font-weight: 600; letter-spacing: .06em; border-radius: 999px; }
.pl-chip i { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; background: var(--gold); border-radius: 50%; }
.pl-chip .pl-ico { width: 13px; height: 13px; color: #fff; }
.pl-hero h1 { margin: 20px 0 14px; font-size: var(--ms-h1); line-height: .98; color: #fff !important; text-shadow: 0 10px 40px rgba(0,0,0,.3); }
.pl-hero h1 em { font-style: normal; color: var(--gold-l); }
.pl-lead { max-width: 580px; font-size: calc(17.5px * var(--ms-k-text)); line-height: calc(1.7 * var(--ms-k-lh)); color: rgba(255,255,255,.88); }
.pl-facts-h { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 56px 0 18px; }
.pl-facts-h span { font-size: calc(12px * var(--ms-k-text)); font-weight: 600; letter-spacing: var(--ms-kicker-ls); text-transform: uppercase; color: var(--gold-l); }
.pl-facts-h small { font-size: calc(13px * var(--ms-k-text)); color: rgba(255,255,255,.62); text-align: right; }
.pl-facts { display: grid; grid-template-columns: repeat(var(--cols, 6), minmax(0, 1fr)); gap: 12px; }
.pl-fact { padding: 20px 18px; border-radius: var(--ms-card-radius); }
.pl-fact .pl-ico { display: block; width: 24px; height: 24px; margin-bottom: 14px; color: var(--gold-l); }
.pl-fact b { display: block; margin-bottom: 6px; font: 400 26px/1.1 var(--hd); overflow-wrap: anywhere; }
.pl-fact small { display: block; font-size: calc(12.5px * var(--ms-k-text)); line-height: calc(1.45 * var(--ms-k-lh)); color: rgba(255,255,255,.78); }

/* B: topic tabs; fixed under the site's header while the topics are read (js/site-policy.js) */
.pl-tabs-holder { position: relative; z-index: 20; }
.pl-tabs-bar { background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 10px 30px rgba(var(--ms-ink-rgb),.05); }
.pl-tabs-bar.is-fixed { position: fixed; left: 0 !important; right: 0; margin-left: 0 !important; width: auto !important; z-index: 90; }
.pl-tabs-wrap { position: relative; display: flex; align-items: center; gap: 8px; }
.pl-tabs { display: flex; flex: 1 1 auto; gap: 6px; min-width: 0; padding: 16px 0; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none; }
.pl-tabs::-webkit-scrollbar { display: none; }
.pl-tabs.has-r { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
.pl-tabs.has-l { -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%); mask-image: linear-gradient(90deg, transparent, #000 15%); }
.pl-tabs.has-l.has-r { -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.pl-tab { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 8px; padding: 11px 18px; font-size: calc(14px * var(--ms-k-text)); font-weight: 500; line-height: calc(1.2 * var(--ms-k-lh)); white-space: nowrap; color: var(--ink) !important; background: #fff; border: 1px solid var(--line); border-radius: 999px; transition: background var(--ms-speed) ease, border-color var(--ms-speed) ease, color var(--ms-speed); }
.pl-tab .pl-ico { width: 17px; height: 17px; color: var(--gold); }
.pl-tab:hover { border-color: var(--gold); }
.pl-tab.is-on { color: #fff !important; background: var(--g); border-color: var(--g); }
.pl-tab.is-on .pl-ico { color: var(--gold-l); }
.pl-tabs-arrow { display: inline-flex; flex: 0 0 38px; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0; color: var(--g); background: #fff; border: 1px solid var(--line); border-radius: 50%; cursor: pointer; }
.pl-tabs-arrow[hidden] { display: none; }
.pl-tabs-arrow:hover:not(:disabled) { color: #fff; background: var(--g); border-color: var(--g); }
.pl-tabs-arrow:disabled { opacity: .35; cursor: default; }

/* C: the chosen topic beside the contact card */
.pl-body { background: #fff; }
.pl-body-in { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 60px; align-items: start; padding-top: 70px; padding-bottom: 90px; }
.pl-body-in.is-solo { grid-template-columns: minmax(0, 520px); justify-content: center; }
.pl.js .pl-topic:not(.is-on) { display: none; }
.pl-topic + .pl-topic { margin-top: 60px; }
.pl.js .pl-topic + .pl-topic { margin-top: 0; }
.pl-topic.is-on { animation: pl-in .45s ease both; }
@keyframes pl-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.pl-topic-h { margin-bottom: 8px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.pl-topic-n { display: block; margin-bottom: 4px; font: 400 15px var(--hd); letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.pl-topic-h h2 { font-size: var(--ms-h2); line-height: 1.05; color: var(--ink); }
.pl-topic-h p { margin-top: 6px !important; font-size: calc(14.5px * var(--ms-k-text)); color: var(--mut); }
.pl-q { border-bottom: 1px solid var(--line); }
.pl-q summary { display: grid; grid-template-columns: 70px minmax(0, 1fr) 38px; gap: 10px; align-items: center; padding: 24px 0; list-style: none; cursor: pointer; }
.pl-q summary::-webkit-details-marker { display: none; }
.pl-q-n { font: 300 44px/1 var(--hd); color: var(--ms-line-d); transition: color .2s; }
.pl-q-t { font: 400 var(--ms-h4)/1.3 var(--hd); color: var(--ink); }
.pl-q-tg { position: relative; display: inline-block; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; transition: background var(--ms-speed) ease, border-color var(--ms-speed) ease; }
.pl-q-tg::before, .pl-q-tg i { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 1.8px; margin: -0.9px 0 0 -7px; background: var(--g); border-radius: 2px; transition: transform .25s, background .2s; }
.pl-q-tg i { transform: rotate(90deg); }
.pl-q summary:hover .pl-q-tg { border-color: var(--gold); }
.pl-q[open] .pl-q-n { color: var(--gold); }
.pl-q[open] .pl-q-tg { background: var(--gold); border-color: var(--gold); }
.pl-q[open] .pl-q-tg::before, .pl-q[open] .pl-q-tg i { background: #fff; }
.pl-q[open] .pl-q-tg i { transform: rotate(0deg); }
.pl-a { padding: 0 50px 26px 80px; animation: pl-in .35s ease both; }
.pl-a p { margin: 0 0 12px !important; padding: 0 !important; font-size: var(--ms-text-size); line-height: calc(1.85 * var(--ms-k-lh)); color: var(--mut); }
.pl-a p:last-of-type { margin-bottom: 0 !important; }
.pl-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.pl-chips span { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; font-size: calc(13px * var(--ms-k-text)); font-weight: 600; color: var(--g); background: var(--cream); border-radius: 999px; }
.pl-chips .pl-ico { width: 14px; height: 14px; color: var(--gold); }
.pl-next { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 30px; padding: 22px 26px; background: var(--cream); border-radius: var(--ms-card-radius); }
.pl-next small { display: block; font-size: calc(11.5px * var(--ms-k-text)); font-weight: 600; letter-spacing: var(--ms-kicker-ls); text-transform: uppercase; color: var(--gold); }
.pl-next b { font: 400 22px/1.25 var(--hd); color: var(--ink); }

.pl-card { overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 24px 60px rgba(var(--ms-ink-rgb),.1); }
.pl-card-h { padding: 26px 26px 22px; color: #fff; background-size: cover; background-position: center; }
.pl-card-h .pl-kicker { color: var(--gold-l); }
.pl-card-h h3 { margin: 0 0 8px; font-size: calc(30px * var(--ms-k-h3)); line-height: 1.1; color: #fff !important; }
.pl-card-h p { font-size: calc(14px * var(--ms-k-text)); line-height: calc(1.6 * var(--ms-k-lh)); color: rgba(255,255,255,.82); }
.pl-wa { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; padding: 9px 15px; font-size: calc(13.5px * var(--ms-k-text)); font-weight: 600; color: #fff !important; border-radius: 999px; }
.pl-wa .pl-ico { width: 16px; height: 16px; color: var(--gold-l); }
.pl-card-b { padding: 24px 26px 26px; }
.pl-card-b .cms-field > span { font-size: calc(11.5px * var(--ms-k-text)); font-weight: 600; letter-spacing: .14em; color: var(--ink); opacity: 1; }
.pl-card-b .cms-form input[type=text], .pl-card-b .cms-form input[type=email], .pl-card-b .cms-form input[type=tel], .pl-card-b .cms-form textarea { border-color: #dcd6c9; border-radius: 4px; }
.pl-card-b .cms-form textarea { min-height: 100px; }
.pl-card-b .cms-check { font-size: calc(13px * var(--ms-k-text)); line-height: calc(1.5 * var(--ms-k-lh)); color: var(--mut); }
.pl-card-b .cms-btn { background: var(--g); border-radius: 3px; letter-spacing: .1em; font-size: calc(13px * var(--ms-k-text)); }
.pl-card-b .cms-btn:hover { background: var(--gold); }

/* D: house rules */
.pl-rules { padding: 90px 0; background: var(--cream); }
.pl-rules-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 36px; }
.pl-rules-top h2 { font-size: calc(clamp(34px, 4vw, 46px) * var(--ms-k-h2)); line-height: 1.05; color: var(--ink); }
.pl-rules-top p { max-width: 420px; font-size: calc(15.5px * var(--ms-k-text)); line-height: calc(1.7 * var(--ms-k-lh)); color: var(--mut); text-align: right; }
.pl-rule-grid { display: grid; grid-template-columns: repeat(var(--cols, 6), minmax(0, 1fr)); gap: 14px; }
.pl-rule { padding: 26px 18px; text-align: center; background: #fff; border: 1px solid var(--line); border-radius: var(--ms-card-radius); transition: transform var(--ms-speed) ease, box-shadow var(--ms-speed) ease; }
.pl-rule:hover { transform: translateY(var(--ms-lift)); box-shadow: 0 16px 34px rgba(var(--ms-ink-rgb),.08); }
.pl-rule i { display: inline-flex; align-items: center; justify-content: center; width: 58px; height: 58px; margin-bottom: 14px; color: var(--g); background: rgba(var(--ms-green-rgb),.07); border-radius: 50%; }
.pl-rule .pl-ico { width: 26px; height: 26px; }
.pl-rule b { display: block; font-size: calc(15px * var(--ms-k-text)); font-weight: 500; line-height: calc(1.4 * var(--ms-k-lh)); color: var(--ink); }

@media (prefers-reduced-motion: reduce) {
  .pl-topic.is-on, .pl-a { animation: none; }
}
@media (max-width: 1024px) {
  .pl-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pl-body-in { grid-template-columns: minmax(0, 1fr) 320px; gap: 36px; }
  .pl-rule-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .pl-body-in { grid-template-columns: 1fr; }
  .pl-side { max-width: 560px; }
}
@media (max-width: 760px) {
  .pl-wrap { padding: 0 18px; }
  .pl-hero-in { padding-top: 130px; padding-bottom: 40px; }
  .pl-lead { font-size: calc(16px * var(--ms-k-text)); }
  .pl-facts-h { flex-direction: column; align-items: flex-start; gap: 4px; margin-top: 40px; }
  .pl-facts-h small { text-align: left; }
  .pl-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .pl-fact { padding: 16px 14px; }
  .pl-fact b { font-size: calc(22px * var(--ms-k-text)); }
  .pl-tabs { padding: 12px 0; }
  .pl-tab { padding: 9px 14px; font-size: calc(13px * var(--ms-k-text)); }
  .pl-tabs-arrow { display: none !important; }
  .pl-body-in { padding-top: 44px; padding-bottom: 60px; }
  .pl-q summary { grid-template-columns: 44px minmax(0, 1fr) 34px; padding: 20px 0; }
  .pl-q-n { font-size: calc(30px * var(--ms-k-text)); }
  .pl-q-t { font-size: calc(18px * var(--ms-k-text)); }
  .pl-q-tg { width: 34px; height: 34px; }
  .pl-a { padding: 0 0 22px 0; }
  .pl-next { flex-direction: column; align-items: flex-start; }
  .pl-next .cms-sec__btn { width: 100%; }
  .pl-rules { padding: 60px 0; }
  .pl-rules-top { flex-direction: column; align-items: flex-start; gap: 12px; }
  .pl-rules-top p { text-align: left; }
  .pl-rule-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .pl-rule { padding: 20px 12px; }
}

/* Phones: the opening, the topic titles, the "next topic" card, the house rules title and the question card's top are
   centred (on the left they left an empty strip on the right). The answers and the cards keep their alignment. */
@media (max-width: 767px) {
  .pl-hero-in { text-align: center; }
  .pl-hero-in .pl-facts { text-align: left; }
  .pl-lead { margin-left: auto; margin-right: auto; }
  .pl-facts-h { align-items: center; }
  .pl-facts-h small { text-align: center; }
  .pl-topic-h { text-align: center; }
  .pl-next { align-items: center; text-align: center; }
  .pl-rules-top { align-items: center; text-align: center; }
  .pl-rules-top p { text-align: center; }
  .pl-card-h { text-align: center; }
}
