/* Premium page cart (R3 p1). Hand-authored, namespaced ca-prem-. Teal #009999, orange #FFA500. */
.ca-prem{max-width:760px;margin:0 auto;border:2px dashed #009999;border-radius:16px;padding:18px 16px;background:#f8fdfd;color:#1e293b;font-size:.95rem;line-height:1.5}
.ca-prem-step{font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#007a7a;margin:16px 0 8px}
.ca-prem-step:first-child{margin-top:0}
.ca-prem-step span{font-weight:400;text-transform:none;letter-spacing:0;color:#94a3b8;margin-left:.4rem}
.ca-prem-note{margin:0 0 8px;color:#475569;font-size:.9rem}
.ca-prem-gate{background:#fff;border:2px solid #e2e8f0;border-radius:12px;padding:16px;text-align:center}
.ca-prem-gate h3{margin:0 0 4px;font-size:1.05rem;font-weight:700}
.ca-prem-gate p{margin:0;color:#475569}
.ca-prem-help{font-size:.8rem;color:#94a3b8;margin:8px 0 0}
.ca-prem-help a{color:#007a7a;font-weight:700}
.ca-prem-btn{display:inline-flex;align-items:center;gap:.5rem;border-radius:10px;font-weight:600;font-size:.9rem;padding:.6rem 1.1rem;border:2px solid #009999;color:#009999;background:#fff;cursor:pointer;font-family:inherit;text-decoration:none;white-space:nowrap;margin-top:10px}
.ca-prem-btn:focus-visible{outline:2px solid #FFA500;outline-offset:2px}
.ca-prem-btn-primary,.ca-prem a.ca-prem-btn-primary{background:#009999;color:#fff}
.ca-prem-btn-primary:hover{background:#007a7a;border-color:#007a7a}
.ca-prem-btn[disabled]{opacity:.5;cursor:default}
.ca-prem-row{display:flex;align-items:center;gap:.7rem;padding:.6rem .8rem;border:2px solid #e2e8f0;border-radius:11px;background:#fff;margin-bottom:.45rem;cursor:pointer}
.ca-prem-row-on{border-color:#009999;background:#f4fbfb}
.ca-prem-row-pinned{border-color:#009999;background:#f4fbfb;box-shadow:0 0 0 1px #009999}
.ca-prem-row-premium{opacity:.7;background:#f1f5f9;cursor:default}
.ca-prem-row-not_manager{opacity:.55;background:#f8fafc;cursor:default}
.ca-prem-row-hidden{display:none}
.ca-prem-box{width:18px;height:18px;accent-color:#009999;flex-shrink:0;margin:0}
.ca-prem-tick{width:18px;text-align:center;color:#009999;font-weight:800;flex-shrink:0}
.ca-prem-row-main{flex:1;min-width:0;display:flex;flex-direction:column}
.ca-prem-row-name{font-weight:700;font-size:.92rem}
.ca-prem-row-addr{font-size:.78rem;color:#94a3b8}
.ca-prem-pill{font-size:.68rem;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap;margin-left:auto}
.ca-prem-pill-link{background:#FFA500;color:#fff}
.ca-prem-pill-premium{background:#D4F4EF;color:#007a7a}
.ca-prem-pill-not_manager{background:#f1f5f9;color:#64748b}
.ca-prem-tools{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin:.5rem 0}
.ca-prem-search{flex:1;min-width:180px;border:1px solid #cbd5e1;border-radius:9px;padding:.5rem .7rem;font:inherit;font-size:.9rem}
.ca-prem-chip{border:1px solid #009999;color:#007a7a;background:#fff;border-radius:999px;font:inherit;font-size:.78rem;font-weight:700;padding:.35rem .75rem;cursor:pointer}
.ca-prem-chip-ghost{border-color:#e2e8f0;color:#64748b}
.ca-prem-count{font-size:.8rem;color:#64748b;margin:2px 0 8px}
.ca-prem-pager{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin:6px 0 0}
.ca-prem-pager[hidden]{display:none}
.ca-prem-pager-btn{border:1.5px solid #009999;background:#fff;color:#007a7a;border-radius:999px;padding:.45rem .9rem;font:inherit;font-size:.85rem;font-weight:600;cursor:pointer}
.ca-prem-pager-btn:disabled{opacity:.4;cursor:default}
.ca-prem-pager-btn:focus-visible{outline:2px solid #009999;outline-offset:2px}
.ca-prem-pager-status{font-size:.85rem;color:#475569}
.ca-prem-quiet{font-size:.8rem;color:#64748b;margin:8px 0 0}
.ca-prem-quiet a{color:#007a7a;font-weight:700}
.ca-prem-name{border:1px solid #e2e8f0;border-radius:10px;background:#fff;padding:.5rem .8rem;margin-top:.6rem}
.ca-prem-group summary{cursor:pointer;font-weight:600;color:#475569}
.ca-prem-group summary small{font-weight:400;color:#94a3b8}
.ca-prem-group .ca-prem-row{margin-top:.45rem}
.ca-prem-banner{background:#FFA500;color:#fff;border-radius:10px;padding:.6rem .9rem;font-weight:700;font-size:.85rem;margin-bottom:.6rem}
.ca-prem-down{background:#fee2e2;color:#991b1b;border-radius:10px;padding:.7rem 1rem;font-weight:600;margin:0}
.ca-prem-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.7rem}
.ca-prem-plan{position:relative;text-align:left;border:2px solid #e2e8f0;border-radius:12px;background:#fff;padding:.8rem;font:inherit;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.ca-prem-plan:hover{border-color:#009999}
.ca-prem-plan-on{border-color:#009999;background:#f4fbfb;box-shadow:0 0 0 1px #009999}
.ca-prem-plan-static{cursor:default;opacity:.85}
.ca-prem-ribbon{position:absolute;top:-10px;right:10px;background:#FFA500;color:#fff;font-size:.62rem;font-weight:700;padding:2px 8px;border-radius:999px;letter-spacing:.05em;text-transform:uppercase}
.ca-prem-plan-name{font-weight:700;font-size:.92rem}
.ca-prem-plan-price{font-family:Georgia,'Times New Roman',serif;font-size:1.5rem;line-height:1.2}
.ca-prem-plan-price s{font-family:inherit;font-size:.9rem;color:#94a3b8;margin-right:.3rem}
.ca-prem-plan-price small{font-family:inherit;font-size:.72rem;color:#94a3b8;margin-left:.2rem}
.ca-prem-plan-note{font-size:.78rem;color:#475569}
.ca-prem-pay{font-size:.78rem;color:#94a3b8;margin:.5rem 0 0}
.ca-prem-pay span{border:1px solid #e2e8f0;border-radius:5px;padding:1px 7px;font-weight:600;margin-left:3px}
.ca-prem-summary{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:.8rem 1rem}
.ca-prem-sum-row{display:flex;justify-content:space-between;padding:3px 0;color:#475569;font-size:.9rem}
.ca-prem-sum-total{border-top:1px solid #e2e8f0;margin-top:5px;padding-top:8px;font-weight:700;color:#1e293b;font-size:1rem}
.ca-prem-error{background:#fee2e2;color:#991b1b;border-radius:8px;padding:.6rem .9rem;font-weight:600;margin:.6rem 0 0}
.ca-prem-sticky{display:none}
.ca-prem-outer{container-type:inline-size}
@container (max-width:640px){
  .ca-prem{padding:14px 10px;border-radius:12px}
  .ca-prem-plans{grid-template-columns:1fr 1fr;gap:.45rem}
  .ca-prem-plan{padding:.6rem}
  .ca-prem-plan-price{font-size:1.2rem}
  /* The pill's flex-basis:100% only drops it onto its own line if the row is allowed to
     wrap. Without this the pill is laid out inline on top of the address and squeezes the
     name/address column to a few characters a line. Covers all three pills. */
  .ca-prem-row{flex-wrap:wrap}
  /* The name/address column claims the whole first line beside the 18px checkbox or tick, so
     the pill always drops to its own line at its natural width. flex-basis:100% on the pill
     did the dropping but stretched every pill into a full-width bar (9/14 mobile pass). */
  .ca-prem-row-main{flex-basis:calc(100% - 18px - .7rem)}
  .ca-prem-pill{margin-left:0;flex:0 0 auto}
  /* Two plans side by side leaves no room for "$99 / listing / month" on one line, and the
     browser broke it mid-phrase. The unit takes its own line under the price instead. */
  .ca-prem-plan-price small{display:block;margin-left:0}
  /* The summary's value must never split ("October 14," / "2026"); the label is what wraps. */
  .ca-prem-sum-row > :last-child{white-space:nowrap;margin-left:.6rem;text-align:right}
}
@media(max-width:640px){
  /* Room under the block for the fixed sticky bar, which would otherwise cover the
     last rows at maximum scroll. */
  .ca-prem{padding-bottom:72px}
  .ca-prem-sticky{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:.6rem;background:#fff;border-top:1px solid #e2e8f0;padding:.6rem .8rem;box-shadow:0 -6px 16px rgba(0,0,0,.06)}
  .ca-prem-sticky[hidden]{display:none}
  /* While the bar is showing, the site's bottom-corner widgets (the Kwixi chat bubble from
     footer.php, the post-carousel back-to-top, the insider-only reporter) rise by the bar's
     height so the Checkout button is never under them. The class comes from premium.js;
     !important because the widgets carry their own inline positioning. */
  body.ca-prem-sticky-on #__kwixi_chatbot_container__,
  body.ca-prem-sticky-on #sp-smart-post-back-to-top-btn,
  body.ca-prem-sticky-on .ca-reporter-btn{transform:translateY(-64px) !important}
  /* The button keeps its full label; the text block is what gives way. Without the
     min-width:0 the text refuses to compress below its longest word and pushes the
     button off the right edge, where it is clipped to "Che". */
  .ca-prem-sticky .ca-prem-btn{margin:0;padding:.5rem .8rem;flex-shrink:0}
  .ca-prem-sticky span{font-size:.8rem;color:#475569;line-height:1.3;flex:1 1 auto;min-width:0}
  .ca-prem-sticky b{display:block;color:#1e293b;font-size:.95rem}
}

/* Item 5 (9/15): optional group name, shown once two or more listings are ticked. */
.ca-prem-name{margin:0 0 12px}
.ca-prem-name label{display:block;font-size:.85rem;font-weight:700;color:#334155;margin:0 0 .3rem}
.ca-prem-name label span{font-weight:400;color:#94a3b8;margin-left:.35rem}
.ca-prem-name input{width:100%;box-sizing:border-box;border:1px solid #cbd5e1;border-radius:9px;padding:.5rem .7rem;font:inherit;font-size:.9rem}
.ca-prem-name input:focus{outline:2px solid #009999;outline-offset:1px;border-color:#009999}
.ca-prem-name small{display:block;margin-top:.3rem;font-size:.75rem;color:#94a3b8}
/* ============================================================================
   Block content typography (R3 p1).

   Everything above styles the cart. This section styles the block content the
   team edits AROUND the cart, which nothing else does: the v1.5 Tailwind reset
   in build/css/v15.css flattens h1-h6 to `font-size:inherit;font-weight:inherit`
   and strips list markers, so a seeded `core/list {"ordered":true}` rendered
   with no numbers at all and every heading rendered at body size.

   Scope: every selector below is under `.ca-premium-page`, the class the
   template puts on <main>, so none of it can reach another template. Within the
   page, the cart (.ca-prem) and the testimonials block (.ca-testimonials) carry
   their own markup and must not be touched - measured on the seeded page, they
   hold 8 <p> and 4 <img> between them and zero wp-block-* classes, so the
   paragraph, link and image rules below are keyed to the wp-block-* classes
   that only editor content carries. Headings are safe as bare elements: both
   blocks contain zero h2/h3/h4.

   Sizes, weights and colours are the established v1.5 scale, measured off
   /national-partners/ rather than read off the guide alone: Playfair Display
   30px/400 slate-800 for a page-level heading, Playfair 20px for the step
   below, Outfit 16px/1.6 slate-600 for body. Teal links, orange on hover.
   Ref: .claude/style-guide.md (Typography, Buttons & Links).
   ========================================================================== */
.ca-premium-page h2,
.ca-premium-page h3{font-family:'Playfair Display',Georgia,'Times New Roman',serif;color:#1e293b;font-weight:400}
.ca-premium-page h2{font-size:1.875rem;line-height:1.2;margin:2rem 0 .75rem}
.ca-premium-page h3{font-size:1.25rem;line-height:1.4;margin:1.75rem 0 .5rem}
.ca-premium-page h4{font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif;font-size:1.125rem;font-weight:600;color:#1e293b;line-height:1.4;margin:1.5rem 0 .5rem}
.ca-premium-page h2:first-child,
.ca-premium-page h3:first-child,
.ca-premium-page h4:first-child{margin-top:0}
.ca-premium-page p.wp-block-paragraph,
.ca-premium-page > div > p{font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif;font-size:1rem;line-height:1.6;color:#475569;margin:0 0 1rem}
.ca-premium-page ol.wp-block-list{list-style:decimal outside}
.ca-premium-page ul.wp-block-list{list-style:disc outside}
.ca-premium-page ol.wp-block-list,
.ca-premium-page ul.wp-block-list{font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif;font-size:1rem;line-height:1.6;color:#475569;padding-left:1.5rem;margin:0 0 1.25rem}
.ca-premium-page .wp-block-list li{list-style:inherit;margin:0 0 .5rem}
.ca-premium-page .wp-block-list li::marker{color:#007a7a}
.ca-premium-page .wp-block-list ol,
.ca-premium-page .wp-block-list ul{margin:.5rem 0 0}
.ca-premium-page p.wp-block-paragraph a,
.ca-premium-page .wp-block-list a{color:#009999;font-weight:600;text-decoration:underline;text-underline-offset:2px;transition:color .15s}
.ca-premium-page p.wp-block-paragraph a:hover,
.ca-premium-page .wp-block-list a:hover{color:#FFA500}
.ca-premium-page .wp-block-image{margin:0 0 1.25rem}
.ca-premium-page .wp-block-image img{max-width:100%;height:auto;border-radius:10px}
.ca-premium-page .has-text-align-center{text-align:center}
@media(min-width:768px){
  .ca-premium-page h2{font-size:2.25rem}
  .ca-premium-page h3{font-size:1.5rem}
}
.ca-premium-page .ca-prem-preview{margin:16px 0}
.ca-premium-page .ca-prem-preview-caption{font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#007a7a;margin:0 0 8px;text-align:center}
.ca-premium-page .ca-prem-preview-note{font-size:.8rem;color:#94a3b8;margin:6px 0 0}
/* A preview, not a result: nothing in it navigates away from the checkout. */
.ca-premium-page .ca-prem-preview a{pointer-events:none}
/* The v1.5 template does not load wp-block-library CSS, so core's stacking rule for Columns
   never arrives; this is that rule, scoped to the page (9/14 mobile pass on the reseeded page). */
.ca-premium-page .wp-block-columns{flex-wrap:wrap !important}
@media (max-width:781px){
  .ca-premium-page .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column{flex-basis:100% !important;flex-grow:1}
}
@media (min-width:782px){
  .ca-premium-page .wp-block-columns > .wp-block-column{flex-basis:0;flex-grow:1;min-width:0}
}

/* ============================================================================
   Variant C sales layout (R3 p5, 9/16). Spec:
   docs/superpowers/specs/2026-09-16-premium-page-polish-c-design.md
   Eyebrow + lead, the Free vs Premium comparison, the cart row with the sticky
   benefits panel, the Testimonials heading and the resources line. Every class
   below is set by the seed on core blocks (ca-prem-*) or rendered by the
   ca/benefits block (ca-benefit*). The cart (.ca-prem) is not touched.
   ========================================================================== */
.ca-premium-page p.ca-prem-eyebrow{font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#FFA500;margin:0 0 .5rem}
.ca-premium-page p.ca-prem-eyebrow + h2{margin-top:0}
.ca-premium-page p.ca-prem-lead{font-size:1.05rem;line-height:1.6;max-width:760px;margin:0 0 1.5rem}
.ca-premium-page p.ca-prem-lead strong{color:#1e293b;font-weight:600}
/* Comparison boxes. Core's Columns CSS is not loaded on this template, so display and gap
   are ours. */
.ca-premium-page .ca-prem-compare,
.ca-premium-page .ca-prem-main{display:flex;gap:1.5rem;align-items:flex-start}
.ca-premium-page .ca-prem-compare{margin:0 0 1.6rem}
.ca-premium-page .ca-prem-compare > .wp-block-column{border-radius:14px;padding:1rem 1.1rem;border:1px solid #e2e8f0;background:#fff}
.ca-premium-page .ca-prem-compare > .ca-prem-compare-premium{border:1.5px solid #009999;background:#eaf7f6}
.ca-premium-page p.ca-prem-compare-label{font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif;font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#64748b;margin:0 0 .3rem}
.ca-premium-page .ca-prem-compare-premium p.ca-prem-compare-label{color:#007a7a}
.ca-premium-page p.ca-prem-compare-price{font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif;font-size:1.25rem;font-weight:700;color:#1e293b;margin:0}
.ca-premium-page p.ca-prem-compare-note{font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif;font-size:.8rem;font-weight:500;color:#64748b;margin:0 0 .6rem}
.ca-premium-page ul.ca-prem-dashes,
.ca-premium-page ul.ca-prem-checks{list-style:none;padding-left:0;margin:0;font-size:.9rem;line-height:1.5;color:#1e293b;font-weight:500}
.ca-premium-page .ca-prem-dashes li,
.ca-premium-page .ca-prem-checks li{position:relative;padding-left:1.6rem;margin:0 0 .35rem}
.ca-premium-page .ca-prem-checks li::before{content:"\2713";position:absolute;left:.1rem;top:0;color:#009999;font-weight:700}
.ca-premium-page .ca-prem-dashes li::before{content:"\2013";position:absolute;left:.15rem;top:0;color:#94a3b8;font-weight:700}
.ca-premium-page .ca-prem-dashes li{color:#475569}
/* Cart row: the cart takes the remaining width, the panel is a fixed 280px rail; the cart
   column must stay above the cart's own 640px container query, so do not widen this without
   re-measuring. The generic column rules above set flex-basis:0 on every column at >=782px;
   these come later in the file at equal specificity, so they win. The site header is not
   sticky (checked 9/16), so only the admin bar offsets the panel. */
.ca-premium-page .ca-prem-main > .wp-block-column:first-child{flex:1 1 0;min-width:0}
.ca-premium-page .ca-prem-main > .ca-prem-side{flex:0 0 280px;position:sticky;top:calc(var(--wp-admin--admin-bar--height,0px) + 1rem);align-self:flex-start;background:#fbf7f2;border:1.5px solid #E5DFD9;border-radius:16px;padding:1.25rem 1.3rem 1.1rem;box-sizing:border-box}
/* The panel only needs to cap its own height and scroll internally while it is actually
   sticky (>=900px); below that it is a normal stacked card and must grow with its content
   (Round 2 review). */
@media (min-width:900px){
  .ca-premium-page .ca-prem-main > .ca-prem-side{max-height:calc(100vh - var(--wp-admin--admin-bar--height,0px) - 2rem);overflow:auto}
}
.ca-premium-page .ca-prem-side h3{font-size:1.2rem;margin:0 0 .25rem}
.ca-premium-page p.ca-prem-side-sub{font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif;font-size:.85rem;color:#64748b;margin:0 0 .9rem}
/* Benefit tiles (ca/benefits block). */
.ca-premium-page .ca-benefits{display:grid;gap:.6rem}
.ca-premium-page .ca-benefit{display:flex;gap:.85rem;align-items:flex-start;font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif}
.ca-premium-page .ca-benefit-ic{width:40px;height:40px;border-radius:10px;background:#D4F4EF;color:#007a7a;display:flex;align-items:center;justify-content:center;flex:none}
.ca-premium-page .ca-benefit-ic svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ca-premium-page .ca-benefit strong{display:block;font-size:.95rem;font-weight:700;color:#1e293b}
.ca-premium-page .ca-benefit span{font-size:.86rem;line-height:1.45;color:#475569}
/* Testimonials heading: the old page's speech bubbles + teal title with a rule under it.
   The icon is a data URI; the template test strips url() payloads before its class scan, so
   the xmlns here may carry a normal, un-encoded host. */
.ca-premium-page .ca-prem-tst-head{font-family:'Outfit','Plus Jakarta Sans',system-ui,sans-serif;font-weight:600;font-size:1.7rem;color:#009999;display:flex;align-items:center;justify-content:center;gap:.6rem;border-bottom:1px solid #e2e8f0;padding-bottom:.5rem;margin:3rem 0 1.5rem}
.ca-premium-page .ca-prem-tst-head::before{content:"";flex:none;width:30px;height:30px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23009999'%3E%3Cpath d='M4 4h11a3 3 0 0 1 3 3v5a3 3 0 0 1-3 3H9l-4 3v-3a3 3 0 0 1-3-3V7a3 3 0 0 1 2-3z'/%3E%3Cpath d='M20 9h1a3 3 0 0 1 3 3v4a3 3 0 0 1-3 3v3l-4-3h-4a3 3 0 0 1-2.5-1.3H15a4.5 4.5 0 0 0 4.5-4.5V9z' opacity='.75'/%3E%3C/svg%3E") center/contain no-repeat}
/* Resources line. */
.ca-premium-page p.ca-prem-resources{text-align:center;font-size:.95rem;margin:2.5rem 0 0}
.ca-premium-page p.ca-prem-resources a{color:#009999;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.ca-premium-page p.ca-prem-resources a:hover{color:#FFA500}
/* Tablet: the rail needs room the cart cannot spare under 900px, so the row stacks (cart
   first, panel as a plain card) and the tiles go two per row. */
@media (max-width:899px){
  .ca-premium-page .ca-prem-main{flex-wrap:wrap}
  .ca-premium-page .ca-prem-main > .wp-block-column:first-child{flex:1 1 100%}
  .ca-premium-page .ca-prem-main > .ca-prem-side{position:static;flex:1 1 100%}
  .ca-premium-page .ca-benefits{grid-template-columns:1fr 1fr}
}
/* Stacked comparison keeps Free first (Chris 9/16). */
@media (max-width:781px){
  .ca-premium-page .ca-prem-compare{flex-wrap:wrap}
  .ca-premium-page .ca-prem-compare > .wp-block-column{flex:1 1 100%}
}
/* Phone. */
@media (max-width:640px){
  .ca-premium-page p.ca-prem-lead{font-size:.98rem}
  .ca-premium-page .ca-prem-compare > .wp-block-column{padding:.9rem .95rem}
  .ca-premium-page p.ca-prem-compare-price{font-size:1.1rem}
  .ca-premium-page .ca-prem-main > .ca-prem-side{padding:1rem 1rem .9rem}
  .ca-premium-page .ca-benefits{grid-template-columns:1fr}
  .ca-premium-page .ca-benefit-ic{width:36px;height:36px}
  .ca-premium-page .ca-prem-tst-head{font-size:1.4rem;margin-top:2.2rem}
  .ca-premium-page p.ca-prem-resources{font-size:.9rem}
}