/* Shared commerce presentation; transaction controls remain owned by CartOne. */
.cfa-commerce-row { margin-bottom: 0 !important; padding-bottom: 48px !important; }
.cfa-commerce-hero-row, .cfa-commerce-row:has(h1) { padding-top: 48px !important; }
.cfa-commerce {
  --cfa-commerce-accent: #26ddd1;
  --cfa-commerce-panel: #071527;
  --cfa-commerce-border: #1c3b54;
  --cfa-commerce-radius: 9px;
  --cfa-commerce-padding: 24px;
  --cfa-commerce-mobile-padding: 20px;
  --cfa-commerce-gap: 16px;
  --cfa-commerce-mobile-gap: 10px;
  min-width: 0;
  color: #f4f7ff;
  font-size: 16px;
  line-height: 1.65;
}
.cfa-commerce *, .cfa-commerce *::before, .cfa-commerce *::after { box-sizing: border-box; }
.cfa-commerce p, .cfa-commerce h1, .cfa-commerce h2, .cfa-commerce h3, .cfa-commerce ol, .cfa-commerce ul { margin: 0; }
.cfa-commerce a { text-decoration: none; }
.cfa-commerce__header { max-width: 900px; margin-bottom: 24px; }
.cfa-commerce__eyebrow { display: flex; align-items: center; gap: 12px; color: var(--cfa-commerce-accent); font-size: 12px; font-weight: 750; line-height: 1.5; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 16px !important; }
.cfa-commerce__eyebrow::before { content: ''; width: 28px; height: 1px; background: currentColor; flex-shrink: 0; }
body.coderfriendai-site .cfa-commerce .cfa-commerce__title { color: #f4f7ff; font-size: clamp(30px, 3.2vw, 44px) !important; font-weight: 650; line-height: 1.12; letter-spacing: -.045em; }
.cfa-commerce__intro { color: #b8c7d8; max-width: 760px; margin-top: 20px !important; }
.cfa-commerce--hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 48px; }
.cfa-commerce__hero-copy { min-width: 0; }
body.coderfriendai-site .cfa-commerce--hero .cfa-commerce__title { font-size: clamp(42px, 4.7vw, 68px) !important; line-height: 1.04; }
.cfa-commerce__title em { display: block; color: var(--cfa-commerce-accent); font-style: normal; background: linear-gradient(100deg, var(--cfa-commerce-accent), #6b9dff 78%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.cfa-commerce--hero .cfa-commerce__intro { max-width: 620px; font-size: 18px; line-height: 1.75; margin-top: 24px !important; }
.cfa-commerce__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 28px; }
.cfa-commerce__button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px; padding: 12px 20px; border: 1px solid transparent; border-radius: var(--cfa-commerce-radius); background: var(--cfa-commerce-accent); color: #021322 !important; font-size: 15px; font-weight: 750; line-height: 1.4; text-align: center; transition: filter .2s ease, border-color .2s ease; }
.cfa-commerce__button:hover { filter: brightness(1.08); }
.cfa-commerce__button--secondary { background: rgba(7,21,39,.45); border-color: #557084; color: #ecf6ff !important; }
.cfa-commerce__button svg, .cfa-commerce__text-link svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.cfa-commerce a:focus-visible, .cfa-commerce summary:focus-visible, .cfa-commerce button:focus-visible { outline: 2px solid var(--cfa-commerce-accent); outline-offset: 4px; }
.cfa-commerce__hero-note { display: flex; align-items: flex-start; gap: 10px; max-width: 560px; color: #90a6bb; font-size: 13px; line-height: 1.6; margin-top: 24px !important; }
.cfa-commerce__hero-note .cfa-icon { width: 18px; height: 18px; flex-shrink: 0; color: var(--cfa-commerce-accent); margin-top: 2px; }
.cfa-commerce__desk { min-width: 0; border: 1px solid #28536b; border-radius: var(--cfa-commerce-radius); background: radial-gradient(ellipse at 90% 0, rgba(38,221,209,.07), transparent 55%), linear-gradient(150deg, #0d2337, #061221 85%); box-shadow: 0 24px 60px rgba(0,0,0,.18); overflow: hidden; }
.cfa-commerce__desk-top { display: flex; align-items: center; gap: 18px; padding: 18px var(--cfa-commerce-padding); border-bottom: 1px solid var(--cfa-commerce-border); color: #849cb2; font: 650 10px/1.5 ui-monospace, monospace; letter-spacing: .1em; }
.cfa-commerce__window-dots { display: flex; flex-shrink: 0; gap: 5px; }
.cfa-commerce__window-dots i { width: 6px; height: 6px; border-radius: 50%; background: #2b5770; }
.cfa-commerce__window-dots i:first-child { background: var(--cfa-commerce-accent); }
.cfa-commerce__desk-content { padding: var(--cfa-commerce-padding); }
.cfa-commerce__desk-status { display: flex; align-items: center; gap: 7px; color: var(--cfa-commerce-accent); font-size: 11px; font-weight: 650; letter-spacing: .06em; margin-bottom: 12px !important; }
.cfa-commerce__desk-status i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px rgba(38,221,209,.4); }
body.coderfriendai-site .cfa-commerce__desk h2 { color: #f4f7ff; font-size: clamp(23px, 2vw, 29px) !important; font-weight: 650; letter-spacing: -.035em; line-height: 1.25; }
.cfa-commerce__desk-rows { display: grid; gap: var(--cfa-commerce-gap); list-style: none; padding: 0; margin-top: 24px !important; }
.cfa-commerce__desk-rows > li { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 16px 24px; border: 1px solid var(--cfa-commerce-border); border-radius: var(--cfa-commerce-radius); background: rgba(4,16,30,.5); }
.cfa-commerce__desk-icon { display: grid; place-items: center; width: 36px; height: 36px; color: var(--cfa-commerce-accent); border-radius: var(--cfa-commerce-radius); background: rgba(38,221,209,.07); }
.cfa-commerce__desk-icon .cfa-icon { width: 23px; height: 23px; }
.cfa-commerce__desk-rows strong { display: block; color: #eef7ff; font-size: 16px; font-weight: 650; }
.cfa-commerce__desk-rows p { color: #9eb3c8; font-size: 13px; line-height: 1.5; margin-top: 4px; }
.cfa-commerce__desk-rows small { color: #88a5bc; font: 600 10px/1.5 ui-monospace, monospace; text-align: right; }
.cfa-commerce__desk-note { display: flex; align-items: center; gap: 10px; padding: 16px var(--cfa-commerce-padding); color: #9ab0c4; font-size: 12px; border-top: 1px solid var(--cfa-commerce-border); background: rgba(2,10,21,.4); }
.cfa-commerce__desk-note .cfa-icon { width: 16px; height: 16px; flex-shrink: 0; color: var(--cfa-commerce-accent); }
.cfa-commerce__grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--cfa-commerce-gap); }
.cfa-commerce__grid--two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.cfa-commerce__card { --cfa-commerce-card-accent: var(--cfa-commerce-accent); display: flex; flex-direction: column; min-width: 0; padding: var(--cfa-commerce-padding); border: 1px solid var(--cfa-commerce-border); border-radius: var(--cfa-commerce-radius); background: linear-gradient(150deg, color-mix(in srgb, var(--cfa-commerce-panel) 92%, var(--cfa-commerce-card-accent)), var(--cfa-commerce-panel) 55%); }
.cfa-commerce__card--blue { --cfa-commerce-card-accent: #74a7ff; }
.cfa-commerce__card--violet { --cfa-commerce-card-accent: #b394ff; }
.cfa-commerce__card-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.cfa-commerce__card-icon { display: inline-grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; border: 1px solid color-mix(in srgb, var(--cfa-commerce-card-accent, var(--cfa-commerce-accent)) 30%, transparent); border-radius: var(--cfa-commerce-radius); background: color-mix(in srgb, var(--cfa-commerce-card-accent, var(--cfa-commerce-accent)) 8%, transparent); color: var(--cfa-commerce-card-accent, var(--cfa-commerce-accent)); }
.cfa-commerce__card-icon .cfa-icon { width: 24px; height: 24px; }
.cfa-commerce__meta { color: var(--cfa-commerce-card-accent, var(--cfa-commerce-accent)); font-size: 11px; font-weight: 650; letter-spacing: .09em; line-height: 1.5; }
body.coderfriendai-site .cfa-commerce__card h3, body.coderfriendai-site .cfa-commerce__step h3 { color: #f2f7ff; font-size: 23px; font-weight: 650; letter-spacing: -.035em; line-height: 1.3; margin-bottom: 16px; }
.cfa-commerce__card > p, .cfa-commerce__step > p { color: #aebfd0; font-size: 15px; line-height: 1.7; }
.cfa-commerce__checklist { display: grid; gap: 12px; padding: 24px 0 0; list-style: none; }
.cfa-commerce__checklist li { display: flex; gap: 10px; align-items: flex-start; color: #b9cbdc; font-size: 14px; line-height: 1.6; }
.cfa-commerce__checklist li > span { color: var(--cfa-commerce-card-accent); }
.cfa-commerce__text-link { display: inline-flex; align-items: center; gap: 12px; color: var(--cfa-commerce-card-accent, var(--cfa-commerce-accent)) !important; font-size: 14px; font-weight: 650; margin-top: 24px; }
.cfa-commerce__notice { display: flex; align-items: flex-start; gap: 12px; color: #9fb3c7; border: 1px solid var(--cfa-commerce-border); border-radius: var(--cfa-commerce-radius); padding: 16px 24px; margin-top: 24px !important; background: rgba(8,25,42,.7); font-size: 14px; line-height: 1.6; }
.cfa-commerce__notice .cfa-icon { width: 20px; height: 20px; flex-shrink: 0; color: var(--cfa-commerce-accent); margin-top: 2px; }
.cfa-commerce__steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--cfa-commerce-gap); padding: 0; list-style: none; }
.cfa-commerce__step { position: relative; display: flex; flex-direction: column; padding: var(--cfa-commerce-padding); border: 1px solid var(--cfa-commerce-border); border-radius: var(--cfa-commerce-radius); background: var(--cfa-commerce-panel); min-width: 0; }
.cfa-commerce__card > .cfa-commerce__text-link,
.cfa-commerce__step > .cfa-commerce__text-link,
.cfa-commerce__card > .cfa-commerce__actions { margin-top: auto; padding-top: 24px; }
.cfa-commerce__notice + .cfa-commerce__grid { margin-top: var(--cfa-commerce-gap); }
.cfa-commerce__step-number { position: absolute; top: 24px; right: 24px; color: #547289; font: 600 15px/1.5 ui-monospace, monospace; }
.cfa-commerce__step > .cfa-commerce__card-icon { margin-bottom: 24px; }
.cfa-commerce--faq { display: grid; grid-template-columns: minmax(0,4fr) minmax(0,7fr); align-items: start; gap: 48px; }
.cfa-commerce--faq .cfa-commerce__header { margin-bottom: 0; }
.cfa-commerce__faq-list { display: grid; gap: var(--cfa-commerce-gap); }
.cfa-commerce__faq-item { border: 1px solid var(--cfa-commerce-border); border-radius: var(--cfa-commerce-radius); background: var(--cfa-commerce-panel); overflow: hidden; }
.cfa-commerce__faq-item > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: var(--cfa-commerce-padding); cursor: pointer; color: #eaf4ff; font-size: 16px; font-weight: 600; line-height: 1.5; }
.cfa-commerce__faq-item > summary::-webkit-details-marker { display: none; }
.cfa-commerce__faq-item > summary i { position: relative; width: 16px; height: 16px; flex-shrink: 0; }
.cfa-commerce__faq-item > summary i::before, .cfa-commerce__faq-item > summary i::after { content: ''; position: absolute; background: var(--cfa-commerce-accent); top: 7px; left: 0; width: 16px; height: 2px; }
.cfa-commerce__faq-item > summary i::after { transform: rotate(90deg); }
.cfa-commerce__faq-item[open] > summary i::after { transform: none; }
.cfa-commerce__faq-item[open] > summary { color: var(--cfa-commerce-accent); }
.cfa-commerce__faq-item > div { padding: 0 var(--cfa-commerce-padding) var(--cfa-commerce-padding); color: #aebfd0; font-size: 15px; line-height: 1.75; }
@media (max-width: 1100px) { .cfa-commerce--hero { grid-template-columns: minmax(0,1fr); gap: 34px; } .cfa-commerce__hero-copy { max-width: 850px; } }
@media (max-width: 767px) {
  .cfa-commerce-row { padding-bottom: 34px !important; }
  .cfa-commerce-hero-row, .cfa-commerce-row:has(h1) { padding-top: 34px !important; }
  .cfa-commerce__header { margin-bottom: 20px; }
  .cfa-commerce__grid, .cfa-commerce__grid--two, .cfa-commerce__steps, .cfa-commerce--faq { grid-template-columns: minmax(0,1fr); gap: var(--cfa-commerce-mobile-gap); }
  .cfa-commerce--faq { gap: 24px; }
  .cfa-commerce__card, .cfa-commerce__step, .cfa-commerce__desk-content, .cfa-commerce__faq-item > summary { padding: var(--cfa-commerce-mobile-padding); }
  .cfa-commerce__desk-top, .cfa-commerce__desk-note { padding-right: var(--cfa-commerce-mobile-padding); padding-left: var(--cfa-commerce-mobile-padding); }
  .cfa-commerce__faq-item > div { padding-right: var(--cfa-commerce-mobile-padding); padding-bottom: var(--cfa-commerce-mobile-padding); padding-left: var(--cfa-commerce-mobile-padding); }
  .cfa-commerce__desk-rows { gap: var(--cfa-commerce-mobile-gap); margin-top: 20px !important; }
  .cfa-commerce__desk-rows > li { grid-template-columns: 32px minmax(0,1fr); gap: 12px; padding: 16px 24px; }
  .cfa-commerce__desk-rows small { grid-column: 2; text-align: left; }
  .cfa-commerce__actions { gap: 10px; margin-top: 24px; }
  .cfa-commerce__actions > .cfa-commerce__button { flex: 1 1 190px; }
  .cfa-commerce--hero .cfa-commerce__intro { font-size: 17px; margin-top: 20px !important; }
  .cfa-commerce__hero-note { margin-top: 20px !important; }
  .cfa-commerce__notice { padding: 20px; margin-top: 20px !important; }
  .cfa-commerce__step-number { top: 20px; right: 20px; }
  .cfa-commerce__card-top { margin-bottom: 20px; }
}
@media (prefers-reduced-motion: reduce) { .cfa-commerce__button { transition: none; } }

/* Real CartOne product records provide the license names, prices, and availability. */
.cfa-license-plans { min-width: 0; color: #f4f7ff; }
.cfa-license-plans__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--cfa-commerce-gap,16px); }
.cfa-license-plan { position: relative; display: flex; flex-direction: column; min-width: 0; padding: var(--cfa-commerce-padding,24px); border: 1px solid var(--cfa-commerce-border,#1c3b54); border-radius: var(--cfa-commerce-radius,9px); background: linear-gradient(150deg,#0d2033,var(--cfa-commerce-panel,#071527) 65%); }
.cfa-license-plan--featured { border-color: var(--cfa-commerce-accent,#26ddd1); background: radial-gradient(ellipse at 100% 0,rgba(38,221,209,.12),transparent 68%),linear-gradient(150deg,#0c2636,#071527 75%); box-shadow: inset 0 3px 0 var(--cfa-commerce-accent,#26ddd1),0 16px 40px rgba(0,0,0,.12); }
.cfa-license-plan__badge { display: inline-flex; align-self: flex-start; align-items: center; min-height: 28px; padding: 5px 9px; border: 1px solid #284e63; border-radius: var(--cfa-commerce-radius,9px); color: #a7bdd0; font-size: 11px; font-weight: 650; line-height: 1.5; letter-spacing: .06em; margin-bottom: 24px; }
.cfa-license-plan--featured .cfa-license-plan__badge { color: var(--cfa-commerce-accent,#26ddd1); background: rgba(38,221,209,.07); border-color: rgba(38,221,209,.3); }
body.coderfriendai-site .cfa-license-plan__title { color: #f4f7ff; font-size: 32px; font-weight: 650; line-height: 1.15; letter-spacing: -.04em; margin: 0 0 16px; }
.cfa-license-plan__description { color: #acbfd1; font-size: 15px; line-height: 1.7; margin: 0; }
.cfa-license-plan__price { color: #eef7ff; font-size: clamp(30px,3vw,46px); font-weight: 650; line-height: 1.2; letter-spacing: -.045em; overflow-wrap: break-word; margin: 28px 0 8px; }
.cfa-license-plan--featured .cfa-license-plan__price { color: var(--cfa-commerce-accent,#26ddd1); }
.cfa-license-plan .cfa-license-plan__period { color: #87a0b7; font-size: 13px; line-height: 1.6; margin: 0 0 24px; }
.cfa-license-plan__features { display: grid; gap: 12px; padding: 24px 0; border-top: 1px solid var(--cfa-commerce-border,#1c3b54); list-style: none; margin: 0; color: #bbccdc; font-size: 14px; line-height: 1.6; }
.cfa-license-plan__features li { display: flex; align-items: flex-start; gap: 10px; margin: 0; }
.cfa-license-plan__features li::before { content: '✓'; color: var(--cfa-commerce-accent,#26ddd1); font-size: 13px; flex-shrink: 0; }
.cfa-license-plan__action { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 100%; min-height: 48px; padding: 12px 20px; margin-top: auto; border: 1px solid #35566c; border-radius: var(--cfa-commerce-radius,9px); background: #10293c; color: #eaf6ff !important; text-align: center; font-size: 15px; font-weight: 650; line-height: 1.4; text-decoration: none; }
.cfa-license-plan--featured .cfa-license-plan__action { background: var(--cfa-commerce-accent,#26ddd1); border-color: transparent; color: #021322 !important; }
.cfa-license-plan__action:disabled, .cfa-license-plan__action[aria-disabled="true"] { background: rgba(31,52,71,.45); color: #8ba3b9 !important; border: 1px solid #29445b; box-shadow: none; cursor: default; }
.cfa-license-plan .cfa-license-plan__note { color: #879fb5; font-size: 12px; line-height: 1.6; margin: 16px 0 0; }
.cfa-license-plan form.cfa-license-plan__action { padding: 0; border: 0; background: transparent; }
.cfa-license-plan form.cfa-license-plan__action > .cfa-commerce__button { flex: 0 0 auto; width: 100%; }
.cfa-license-plan__action:focus-visible { outline: 2px solid var(--cfa-commerce-accent,#26ddd1); outline-offset: 4px; }
@media (min-width: 768px) { .cfa-license-plan__description { min-height: 5.1em; } }
@media (max-width: 767px) {
  .cfa-license-plans__grid { grid-template-columns: minmax(0,1fr); gap: var(--cfa-commerce-mobile-gap,10px); }
  .cfa-license-plan { padding: var(--cfa-commerce-mobile-padding,20px); }
  .cfa-license-plan__badge { margin-bottom: 20px; }
  .cfa-license-plan__price { margin-top: 24px; }
}