/* pricing.css — /fiyatlandirma (pr-), /yerini-ayirt (rs-) and /yerini-ayirdik (cf-).
   Design: Claude Design "Rota Yerini Ayirt" (rota-site/design/Rota Yerini Ayirt.dc.html), artboards 1a–4b.
   Mobile first (the 375 artboards); the desktop artboards (1440) are the adaptation from 900px up.
   Colours, radii and fonts are the site tokens (tokens.css); nothing loads from another origin. */

/* ---------- shared ---------- */
.pr,.rs,.cf{--pr-rule:#E9DFD3;--pr-soft-ink:#D9EAF0;--pr-error:#A8362E;--pr-error-line:#C8443C;color:var(--ink)}
.pr :focus-visible,.rs :focus-visible,.cf :focus-visible{outline:3px solid rgba(14,107,132,.55);outline-offset:3px}
.pr-kicker,.rs-kicker{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-dark)}
.rs-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* a small filled check, and its cream variant for the teal card */
.pr-feats li::before,.pr-assure li::before,.cf-badge::before{content:"";flex:none;width:18px;height:18px;margin-top:1px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10' fill='%230E6B84'/%3E%3Cpath d='M6 10.5 L8.8 13.2 L14 7.6' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

/* ---------- /fiyatlandirma ---------- */
.pr{background:linear-gradient(180deg,var(--cream) 0%,var(--white) 420px);padding:28px 20px 48px}
.pr-hero{max-width:880px;margin:0 auto}
.pr-title{margin-top:12px;font-size:36px;line-height:1.04;letter-spacing:-.045em;text-wrap:balance}
.pr-title-line{display:inline}
.pr-sub{margin-top:12px;font-size:15px;line-height:1.5;color:var(--sub);text-wrap:pretty}
.pr-term{display:inline-flex;margin-top:16px;padding:6px 12px;border-radius:var(--radius-pill);background:var(--white);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--brand-dark)}

.pr-plans{max-width:1120px;margin:26px auto 0;display:flex;flex-direction:column;gap:14px}
.pr-plan{position:relative;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-card);padding:22px;display:grid;grid-template-columns:1fr auto;grid-template-areas:"name price" "for price" "feats feats" "cta cta";column-gap:12px;align-items:start}
.pr-name{grid-area:name;font-size:19px;letter-spacing:-.02em;color:var(--ink-head)}
.pr-for{grid-area:for;margin-top:4px;font-size:13px;line-height:1.4;color:var(--sub)}
.pr-price{grid-area:price;display:flex;align-items:baseline;gap:4px;font-variant-numeric:tabular-nums;white-space:nowrap}
.pr-amount{font-family:var(--font-display);font-weight:800;font-size:26px;letter-spacing:-.04em;color:var(--ink-head)}
.pr-per{font-size:12px;color:var(--sub)}
.pr-feats{grid-area:feats;margin-top:16px;display:flex;flex-direction:column;gap:10px}
.pr-feats li{display:flex;gap:9px;font-size:14px;line-height:1.4;color:var(--grey-body)}
.pr-cta{grid-area:cta;margin-top:18px;height:50px;border-radius:var(--radius-pill);border:1.5px solid var(--brand);display:flex;align-items:center;justify-content:center;gap:6px;color:var(--brand);font-size:15px;font-weight:600;transition:background-color .15s ease,color .15s ease}
.pr-cta:hover{background:var(--brand);color:#fff}
.pr-cta:focus-visible{border-radius:var(--radius-pill)}

/* the emphasised tier: first on a phone, raised in the middle on a desktop */
.pr-plan.is-featured{order:-1;margin-top:13px;background:var(--brand);border-color:var(--brand);padding-top:26px;box-shadow:0 28px 60px rgba(14,107,132,.22)}
.pr-plan.is-featured .pr-name,.pr-plan.is-featured .pr-amount,.pr-plan.is-featured .pr-feats li{color:#fff}
.pr-plan.is-featured .pr-for,.pr-plan.is-featured .pr-per{color:var(--pr-soft-ink)}
.pr-plan.is-featured .pr-name{font-size:20px}
.pr-plan.is-featured .pr-amount{font-size:28px}
.pr-plan.is-featured .pr-feats li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10' fill='%23FFF3E7'/%3E%3Cpath d='M6 10.5 L8.8 13.2 L14 7.6' fill='none' stroke='%230E6B84' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.pr-plan.is-featured .pr-cta{height:52px;border:0;background:var(--cream);color:var(--brand-dark);font-size:16px;font-weight:700}
.pr-plan.is-featured .pr-cta:hover{background:#fff;color:var(--brand-dark)}
.pr-plan.is-featured .pr-cta:focus-visible{outline-color:#fff}
.pr-badge{position:absolute;top:-13px;left:22px;height:26px;padding:0 11px;border-radius:var(--radius-pill);background:var(--cream);color:var(--brand-dark);font-size:12px;font-weight:700;display:flex;align-items:center}

.pr-assure{max-width:1120px;margin:22px auto 0;display:flex;flex-direction:column;gap:10px}
.pr-assure li{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--sub)}
.pr-assure li::before{width:16px;height:16px;margin-top:0}
.pr-assure .pr-assure-lock::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Crect x='4' y='9' width='12' height='9' rx='2.5' fill='%230E6B84'/%3E%3Cpath d='M6.5 9 V6.5 A3.5 3.5 0 0 1 13.5 6.5 V9' fill='none' stroke='%230E6B84' stroke-width='2'/%3E%3C/svg%3E")}

@media (min-width:900px){
  .pr{background:linear-gradient(180deg,var(--cream) 0%,var(--white) 560px);padding:72px var(--gutter) 96px}
  .pr-hero{text-align:center;display:flex;flex-direction:column;align-items:center}
  .pr-kicker{font-size:12px}
  .pr-title{margin-top:20px;font-size:clamp(48px,3.2vw + 20px,68px);line-height:1}
  .pr-title-line{display:block}
  .pr-sub{margin-top:22px;max-width:520px;font-size:18px;line-height:1.55}
  .pr-term{margin-top:20px;font-size:14px}
  .pr-plans{margin-top:72px;display:grid;grid-template-columns:1fr 1.12fr 1fr;gap:0;background:var(--white);border:1px solid var(--line);border-radius:28px;align-items:stretch}
  .pr-plan,.pr-plan.is-featured{order:0;display:flex;flex-direction:column;align-items:stretch;border:0;border-radius:28px;padding:44px 36px 40px;margin:0;box-shadow:none}
  .pr-plan.is-featured{margin:-28px 0;padding:52px 40px 44px;box-shadow:0 48px 96px rgba(14,107,132,.24)}
  .pr-name,.pr-plan.is-featured .pr-name{font-family:var(--font-body);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-dark)}
  .pr-plan.is-featured .pr-name{color:var(--pr-soft-ink)}
  .pr-for{margin-top:10px;font-size:15px;line-height:1.5;min-height:46px}
  .pr-price{margin-top:22px;gap:8px}
  .pr-amount{font-size:clamp(40px,2vw + 18px,52px);line-height:1;letter-spacing:-.05em}
  .pr-plan.is-featured .pr-amount{font-size:clamp(44px,2.3vw + 20px,60px)}
  .pr-per{font-size:14px}
  .pr-feats{margin-top:26px;gap:0}
  .pr-feats li{padding:13px 0;border-top:1px solid var(--grey-soft);gap:12px;font-size:15px;line-height:1.45}
  .pr-plan.is-featured .pr-feats li{border-top-color:rgba(255,255,255,.16)}
  .pr-cta{margin-top:auto;height:54px;font-size:16px}
  .pr-feats{margin-bottom:28px}
  .pr-plan.is-featured .pr-cta{height:54px}
  .pr-badge{top:22px;left:auto;right:28px;height:auto;padding:0;background:none;color:var(--cream);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase}
  .pr-assure{margin-top:64px;flex-direction:row;justify-content:center;flex-wrap:wrap;gap:16px 48px}
  .pr-assure li{font-size:14px}
}

/* ---------- /yerini-ayirt ---------- */
.rs{background:var(--cream);padding:16px 20px 40px}
.rs-grid{max-width:1040px;margin:0 auto;display:flex;flex-direction:column}
/* on a phone the two columns dissolve so the plan chip can sit above the heading (artboard 2b) */
.rs-aside,.rs-main{display:contents}
.rs-back{order:0;align-self:flex-start;display:inline-flex;align-items:center;gap:6px;min-height:40px;color:var(--brand);font-size:14px;font-weight:600}
.rs-head{order:2;margin-top:18px}
.rs-steps-wrap{display:none}
#rs-form{order:1;display:contents}
#rs-form[hidden]{display:none}
.rs-code{order:3}
.rs-title{font-size:36px;line-height:1.02;letter-spacing:-.045em}
.rs-title-line{display:inline}
.rs-kicker{display:none}
.rs-lead{margin-top:8px;font-size:15px;line-height:1.5;color:var(--sub)}

.rs-plan{order:1;margin-top:12px}
.rs-plan-chip{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 6px 0 12px;border-radius:var(--radius-pill);background:var(--white);border:1px solid var(--line);font-size:13.5px;color:var(--ink);font-variant-numeric:tabular-nums}
.rs-plan-chip[hidden]{display:none}
.rs-plan-label{color:var(--sub)}
.rs-plan-edit{min-height:30px;padding:0 12px;border-radius:var(--radius-pill);background:var(--grey-soft);color:var(--brand);font-size:12.5px;font-weight:600}
.rs-plan-edit:hover{background:#E4E8ED}
.rs-plan-edit:focus-visible{border-radius:var(--radius-pill)}
.rs-plan-pick{margin:10px 0 0;padding:14px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--white);display:flex;flex-direction:column;gap:8px}
.rs-plan-pick[hidden]{display:none}
.rs-plan-pick legend{padding:0 4px}
.rs-plan-opt{position:relative;display:flex;align-items:center;gap:10px;min-height:48px;padding:0 14px;border:1.5px solid var(--line);border-radius:var(--radius-input);cursor:pointer;font-size:15px}
.rs-plan-opt:has(input:checked){border-color:var(--brand);background:var(--cream)}
.rs-plan-opt input{width:18px;height:18px;margin:0;accent-color:var(--brand)}
.rs-plan-name{font-weight:600;color:var(--ink-head)}
.rs-plan-price{margin-left:auto;color:var(--grey-body);font-variant-numeric:tabular-nums}

.rs-fields{order:3;margin-top:22px;background:var(--white);border-radius:var(--radius-card);padding:22px 20px;border:1px solid var(--line);box-shadow:0 24px 60px rgba(27,31,36,.05);display:flex;flex-direction:column;gap:18px}
.rs-field{display:flex;flex-direction:column;gap:7px}
.rs-label{font-size:14px;font-weight:600;color:var(--ink-head)}
.rs-input{width:100%;height:52px;border-radius:var(--radius-input);border:1px solid var(--line);background:var(--white);padding:0 16px;font-size:16px;color:var(--ink);transition:border-color .15s ease,box-shadow .15s ease}
.rs-input::placeholder{color:#8A939E}
.rs-input:focus{outline:none;border:1.5px solid var(--brand);box-shadow:0 0 0 4px rgba(14,107,132,.16)}
.rs-hint{font-size:12.5px;color:var(--sub)}
.rs-phone{display:flex;align-items:stretch;border-radius:var(--radius-input);border:1px solid var(--line);overflow:hidden;background:var(--white)}
.rs-phone:focus-within{border:1.5px solid var(--brand);box-shadow:0 0 0 4px rgba(14,107,132,.16)}
.rs-cc{flex:none;display:flex;align-items:center;padding:0 12px;background:var(--grey-soft);border-right:1.5px solid var(--line);font-size:16px;font-weight:500;color:var(--grey-body)}
.rs-phone .rs-input{border:0;border-radius:0;height:50px;padding:0 12px;font-variant-numeric:tabular-nums}
.rs-phone .rs-input:focus{box-shadow:none;border:0}
.rs-select-wrap{position:relative}
.rs-select{appearance:none;-webkit-appearance:none;padding-right:44px;cursor:pointer}
.rs-select-wrap::after{content:"";position:absolute;right:14px;top:50%;width:18px;height:18px;margin-top:-9px;pointer-events:none;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 8 L10 13 L15 8' fill='none' stroke='%235B6572' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.rs-pair{display:flex;flex-direction:column;gap:18px}
.rs-error{display:none;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--pr-error)}
.rs-error::before,.rs-code-status.is-error::before{content:"";flex:none;width:15px;height:15px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='%23C8443C'/%3E%3Crect x='9' y='5' width='2' height='6.5' rx='1' fill='%23fff'/%3E%3Ccircle cx='10' cy='14.2' r='1.3' fill='%23fff'/%3E%3C/svg%3E")}
.is-invalid>.rs-error:not(:empty){display:flex}
.is-invalid .rs-input,.is-invalid .rs-phone{border:1.5px solid var(--pr-error-line);box-shadow:0 0 0 4px rgba(200,68,60,.12)}
.is-invalid .rs-phone .rs-input{border:0;box-shadow:none}
.rs-hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.rs-consent{display:flex;gap:12px;align-items:flex-start}
.rs-check{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--brand);cursor:pointer}
.is-invalid .rs-check{outline:1.5px solid var(--pr-error-line);outline-offset:1px;border-radius:6px}
.rs-consent-label{font-size:14px;line-height:1.5;color:var(--grey-body);cursor:pointer}
.rs-consent-label a{font-weight:600;text-decoration:underline;text-underline-offset:3px}
.rs-submit{height:56px;border-radius:var(--radius-pill);background:var(--brand);color:#fff;font-size:17px;font-weight:600;box-shadow:var(--shadow-btn);transition:background-color .15s ease}
.rs-submit:hover{background:var(--brand-dark)}
.rs-submit:disabled{background:var(--brand-dark);cursor:progress}
.rs-submit:focus-visible{border-radius:var(--radius-pill)}
.rs-note{text-align:center;font-size:13px;color:var(--sub)}
.rs-form-error{display:none;padding:12px 14px;border-radius:var(--radius-input);background:#FFF5F4;color:var(--pr-error);font-size:14px;font-weight:500}
.rs-form-error.is-visible{display:block}

/* the code step (artboards 3a/3b) */
.rs-grid.is-code .rs-head,.rs-grid.is-code .rs-plan,.rs-grid.is-code .rs-fields{display:none}
.rs-code[hidden]{display:none}
.rs-code{margin-top:16px}
.rs-code-title{font-size:40px;line-height:1;letter-spacing:-.045em}
.rs-code-sent{margin-top:10px;font-size:15px;line-height:1.5;color:var(--sub)}
.rs-code-sent strong{color:var(--ink);font-weight:600;overflow-wrap:anywhere}
.rs-linkbtn{margin-top:8px;min-height:32px;font-size:14px;font-weight:600;color:var(--brand);text-decoration:underline;text-underline-offset:3px}
.rs-linkbtn:disabled{color:var(--sub);text-decoration:none;cursor:default}
.rs-code-card{margin-top:24px;background:var(--white);border-radius:var(--radius-card);padding:24px 20px;border:1px solid var(--line);box-shadow:0 24px 60px rgba(27,31,36,.05);display:flex;flex-direction:column;gap:20px}
.rs-otp{position:relative}
.rs-otp-input{position:absolute;inset:0;width:100%;height:100%;opacity:0;font-size:16px;cursor:text;z-index:1}
.rs-otp-boxes{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.rs-otp-boxes span{height:60px;border-radius:var(--radius-input);border:1px solid var(--line);background:#F8FAFB;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:800;font-size:26px;color:var(--ink-head)}
.rs-otp-boxes span.is-filled{background:var(--white)}
.rs-otp-boxes span.is-active{border:1.5px solid var(--brand);box-shadow:0 0 0 4px rgba(14,107,132,.16);background:var(--white)}
.rs-otp-boxes span.is-active:empty::after{content:"";width:2px;height:26px;background:var(--brand);animation:rs-caret 1s steps(1) infinite}
@keyframes rs-caret{50%{opacity:0}}
.rs-otp.is-invalid .rs-otp-boxes span.is-filled{border:1.5px solid var(--pr-error-line);background:#FFF5F4}
.rs-otp.is-ok .rs-otp-boxes span{border:1.5px solid var(--brand);background:var(--cream)}
.rs-code-status{display:none;align-items:center;gap:6px;font-size:13.5px;font-weight:500}
.rs-code-status.is-error{display:flex;color:var(--pr-error)}
.rs-code-status.is-ok{display:flex;color:var(--brand-dark);font-weight:600}
.rs-resend{display:flex;justify-content:center;align-items:center;gap:6px;font-size:14px;color:var(--sub)}
.rs-resend .rs-linkbtn{margin:0}
.rs-resend-wait{font-variant-numeric:tabular-nums;color:#6B7280}
.rs-code-note{margin-top:20px;font-size:13px;line-height:1.5;color:var(--sub)}

@media (min-width:900px){
  .rs{padding:40px var(--gutter) 96px}
  .rs-grid{display:grid;grid-template-columns:minmax(0,400px) minmax(0,560px);gap:80px;justify-content:center;align-items:start}
  .rs-aside{display:flex;flex-direction:column;position:sticky;top:24px}
  .rs-aside>*,.rs-main>*,#rs-form>*{order:0}
  .rs-main{display:flex;flex-direction:column}
  #rs-form{display:flex;flex-direction:column}
  #rs-form[hidden]{display:none}
  .rs-head{margin-top:24px}
  .rs-kicker{display:block;font-size:12px}
  .rs-title{margin-top:16px;font-size:56px;line-height:1}
  .rs-title-line{display:block}
  .rs-lead{margin-top:18px;max-width:340px;font-size:16px;line-height:1.55}
  .rs-steps-wrap{display:block}
  .rs-steps{margin-top:36px}
  .rs-steps li{display:flex;gap:18px;padding:16px 0;border-top:1px solid var(--pr-rule)}
  .rs-steps li:last-child{border-bottom:1px solid var(--pr-rule)}
  .rs-step-n{width:28px;padding-top:3px;font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:.08em;color:var(--brand)}
  .rs-steps strong{display:block;font-size:15px;font-weight:600;color:var(--ink-head)}
  .rs-steps li>span:last-child>span{display:block;font-size:13.5px;color:var(--sub)}
  .rs-stork{width:120px;height:auto;margin-top:40px}
  .rs-plan{margin-top:0}
  .rs-plan-chip{min-height:40px;padding:0 6px 0 14px;font-size:14px}
  .rs-fields{margin-top:20px;padding:36px;gap:22px}
  .rs-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .rs-grid.is-code .rs-head{display:block}
  .rs-code{margin-top:0}
  .rs-code-card{padding:28px}
  .rs-otp-boxes{grid-template-columns:repeat(6,64px);justify-content:start;gap:10px}
  .rs-otp-boxes span{height:64px}
}

/* ---------- /yerini-ayirdik ---------- */
.cf{background:linear-gradient(180deg,var(--cream) 0%,var(--white) 380px);padding:8px 20px 40px}
.cf-grid{max-width:1120px;margin:0 auto;display:flex;flex-direction:column}
.cf-scene{order:-1;width:100%;max-width:420px;height:auto;margin:0 auto}
.cf-badge{margin-top:16px;align-self:flex-start;display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 12px;border-radius:var(--radius-pill);background:var(--white);color:var(--brand-dark);font-size:12.5px;font-weight:600}
.cf-badge::before{width:14px;height:14px;margin:0}
.cf-copy{display:flex;flex-direction:column}
.cf-title{margin-top:12px;font-size:46px;line-height:.98;letter-spacing:-.05em}
.cf-lead{margin-top:12px;font-size:15px;line-height:1.55;color:var(--grey-body);text-wrap:pretty}
.cf-rows{margin:22px 0 0}
.cf-rows>div{display:flex;justify-content:space-between;gap:16px;padding:13px 0;font-size:14px;border-top:1px solid var(--pr-rule)}
.cf-rows>div:last-child{border-bottom:1px solid var(--pr-rule)}
.cf-rows dt{color:var(--sub)}
.cf-rows dd{margin:0;font-weight:600;color:var(--ink-head);text-align:right;font-variant-numeric:tabular-nums}
.cf-until{margin-top:22px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--sub)}
.cf-guide{margin-top:8px;display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:var(--radius-card);background:var(--cream);color:var(--ink-head)}
.cf-guide:hover{color:var(--ink-head)}
.cf-guide:hover .cf-guide-btn{background:var(--brand-dark)}
.cf-guide:focus-visible{border-radius:var(--radius-card)}
.cf-guide-copy{display:flex;flex-direction:column;gap:3px}
.cf-guide-t{font-family:var(--font-display);font-weight:800;font-size:16px;letter-spacing:-.02em}
.cf-guide-d{font-size:13px;line-height:1.45;color:var(--sub)}
.cf-guide-btn{height:44px;border-radius:var(--radius-pill);background:var(--brand);color:#fff;font-size:14px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px;transition:background-color .15s ease}
.cf-note{margin-top:14px;font-size:13px;color:var(--sub)}
.cf-note a{text-decoration:underline;text-underline-offset:3px}

@media (min-width:900px){
  .cf{background:linear-gradient(180deg,var(--cream) 0%,var(--white) 620px);padding:48px var(--gutter) 96px}
  .cf-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:64px;align-items:center}
  .cf-scene{order:0;max-width:none}
  .cf-copy{max-width:440px}
  .cf-badge{margin-top:0;min-height:32px;padding:0 14px;font-size:13.5px;background:var(--cream)}
  .cf-badge::before{width:16px;height:16px}
  .cf-title{margin-top:22px;font-size:clamp(60px,3.4vw + 30px,88px)}
  .cf-lead{margin-top:18px;font-size:17px}
  .cf-rows{margin-top:32px}
  .cf-rows>div{padding:15px 0;font-size:15px}
  .cf-until{margin-top:28px;font-size:13px}
  .cf-guide{margin-top:10px;flex-direction:row;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px}
  .cf-guide-t{font-size:17px}
  .cf-guide-d{font-size:13.5px}
  .cf-guide-btn{flex:none;height:40px;padding:0 16px}
}

/* ---- the e-book offer (js/15-guide-popup.js) -------------------------------
   Two columns: the book on the left so there is something to want, the form on the right.
   On a phone the pages become a short fanned strip above the form. */
.gp{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;
    padding:24px;background:rgba(11,27,34,.6);opacity:0;transition:opacity .22s ease}
/* Without this the overlay keeps display:flex while [hidden] is set — invisible at opacity 0 but
   still covering the page and swallowing every click beneath it, including the plan CTAs. */
.gp[hidden]{display:none}
.gp.is-open{opacity:1}
.gp-card{position:relative;display:grid;grid-template-columns:300px 1fr;gap:0;
    width:100%;max-width:760px;background:#fff;border-radius:20px;overflow:hidden;
    box-shadow:0 36px 80px -24px rgba(11,27,34,.5);
    transform:translateY(12px) scale(.985);transition:transform .22s ease}
.gp.is-open .gp-card{transform:none}
.gp-x{position:absolute;top:10px;right:12px;z-index:3;width:34px;height:34px;border:0;
    background:rgba(255,255,255,.75);border-radius:50%;font-size:22px;line-height:1;
    color:#17202A;cursor:pointer}

/* the fanned pages */
.gp-peek{position:relative;background:#0E6B84;overflow:hidden;min-height:340px}
.gp-peek::after{content:'';position:absolute;inset:0;
    background:radial-gradient(circle at 70% 18%,rgba(224,178,90,.35) 0%,rgba(224,178,90,0) 62%)}
.gp-pg{position:absolute;width:196px;height:auto;border-radius:4px;
    box-shadow:0 14px 30px -10px rgba(4,17,22,.55)}
.gp-pg-1{left:52px;top:62px;z-index:3;transform:rotate(-3deg)}
.gp-pg-2{left:96px;top:96px;z-index:2;transform:rotate(4deg)}
.gp-pg-3{left:130px;top:132px;z-index:1;transform:rotate(10deg)}

.gp-body{padding:34px 32px 28px}
.gp-eyebrow{margin:0 0 9px;font-size:12px;font-weight:700;letter-spacing:.1em;
    text-transform:uppercase;color:var(--brand,#0E6B84)}
.gp-title{margin:0 0 14px;font-family:'Manrope',sans-serif;font-weight:800;font-size:26px;
    line-height:1.12;letter-spacing:-.03em;color:var(--ink-head,#17202A)}
.gp-list{margin:0 0 14px;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px}
.gp-list li{position:relative;padding-left:20px;font-size:14px;line-height:1.45;
    color:var(--grey-body,#4B5563)}
.gp-list li::before{content:'';position:absolute;left:0;top:8px;width:10px;height:2px;
    background:var(--mustard,#E0B25A)}
.gp-sub{margin:0 0 18px;font-size:13px;line-height:1.5;color:var(--grey-mid,#6B7280)}
.gp-form{display:flex;flex-direction:column;gap:10px}
.gp-input{height:46px;padding:0 14px;border:1px solid var(--line,#E5E7EB);border-radius:10px;
    font-family:inherit;font-size:15px;color:var(--ink,#1B1F24);background:#fff}
.gp-input:focus{outline:2px solid var(--brand,#0E6B84);outline-offset:-1px;border-color:transparent}
.gp-consent{display:flex;gap:10px;align-items:flex-start;margin:2px 0;
    font-size:13px;line-height:1.5;color:var(--grey-body,#4B5563)}
.gp-consent input{flex:0 0 17px;height:17px;margin-top:2px;accent-color:var(--brand,#0E6B84)}
.gp-consent a{color:var(--brand,#0E6B84)}
.gp-submit{height:48px;border:0;border-radius:9999px;background:var(--brand,#0E6B84);color:#fff;
    font-family:inherit;font-size:15px;font-weight:600;cursor:pointer;margin-top:4px}
.gp-submit:disabled{opacity:.6;cursor:default}
.gp-error{margin:0;min-height:18px;font-size:13px;color:#B3261E}
.gp-note{margin:0;font-size:12px;color:var(--grey-mid,#6B7280)}
/* [hidden] is display:none at the weakest specificity, so a class that sets display wins and the
   element stays on screen. Both panels declare it explicitly. */
.gp-form[hidden],.gp-success[hidden]{display:none}
.gp-success{display:flex;flex-direction:column;align-items:stretch}
.gp-success .gp-submit{width:100%;align-self:stretch}
.gp-success-title{margin:0 0 8px;font-family:'Manrope',sans-serif;font-weight:800;font-size:22px;
    letter-spacing:-.02em;color:var(--ink-head,#17202A)}
.gp-success:focus{outline:none}

@media (max-width:720px){
  .gp{padding:0;align-items:flex-end}
  .gp-card{grid-template-columns:1fr;max-width:none;border-radius:20px 20px 0 0}
  .gp-peek{min-height:138px}
  .gp-pg{width:112px}
  .gp-pg-1{left:24px;top:34px}.gp-pg-2{left:112px;top:52px}.gp-pg-3{left:196px;top:70px}
  .gp-body{padding:24px 22px 22px}
  .gp-title{font-size:22px}
  .gp-list li:nth-child(n+4){display:none}
}
@media (prefers-reduced-motion:reduce){.gp,.gp-card{transition:none}}
