.paai-modal-open {
overflow: hidden;
}
.paai-zone,
.paai-zone * {
box-sizing: border-box;
}
.paai-zone {
--paai-ink: #18211c;
--paai-muted: #657169;
--paai-border: rgba(24, 33, 28, .13);
--paai-accent: #1f6f54;
--paai-paper: #f7f7f3;
position: relative;
width: 100%;
margin: 36px auto;
color: var(--paai-ink);
font-family: inherit;
}
.paai-zone__header {
display: flex;
align-items: end;
justify-content: space-between;
gap: 24px;
margin-bottom: 18px;
padding: 0 2px;
}
.paai-zone__header h2 {
margin: 3px 0 0;
color: var(--paai-ink);
font: 700 clamp(25px, 3vw, 38px)/1.1 inherit;
letter-spacing: -.035em;
}
.paai-zone__kicker {
color: var(--paai-accent);
font-size: 12px;
font-weight: 800;
letter-spacing: .12em;
text-transform: uppercase;
}
.paai-zone--dark .paai-zone__header h2 {
color: #f7fbf9 !important;
text-shadow: 0 1px 18px rgba(0, 0, 0, .22);
}
.paai-zone--dark .paai-zone__kicker {
color: #6ee7b7 !important;
}
.paai-zone--dark .paai-publish-button {
background: #38d889 !important;
color: #071710 !important;
box-shadow: 0 9px 28px rgba(24, 207, 124, .18);
}
.paai-zone--dark .paai-publish-button:hover {
background: #75edbc !important;
color: #071710 !important;
}
.paai-zone--dark .paai-zone__sell {
color: #c6d3cd !important;
}
.paai-zone--dark .paai-link-button {
color: #6ee7b7 !important;
}
.paai-zone--dark .paai-empty {
border-color: rgba(110, 231, 183, .32);
background: rgba(255, 255, 255, .035);
color: #dce8e2;
}
.paai-publish-button,
.paai-next,
.paai-submit {
appearance: none;
border: 0;
border-radius: 999px;
background: var(--paai-ink);
color: #fff;
cursor: pointer;
font: 750 15px/1 inherit;
padding: 14px 20px;
transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.paai-publish-button:hover,
.paai-next:hover,
.paai-submit:hover {
background: var(--paai-accent);
box-shadow: 0 10px 28px rgba(31, 111, 84, .2);
transform: translateY(-1px);
}
.paai-publish-button:focus-visible,
.paai-link-button:focus-visible,
.paai-card a:focus-visible,
.paai-modal button:focus-visible,
.paai-modal input:focus-visible,
.paai-modal textarea:focus-visible {
outline: 3px solid rgba(31, 111, 84, .32);
outline-offset: 3px;
}
.paai-listings {
display: grid;
grid-template-columns: 1fr;
gap: 22px;
}
.paai-empty {
grid-column: 1 / -1;
display: grid;
min-height: 104px;
place-items: center;
border: 1px dashed rgba(31, 111, 84, .32);
border-radius: 18px;
background: #f3f6f4;
color: var(--paai-muted);
font-weight: 650;
padding: 22px;
}
.paai-card {
--card-accent: #587b67;
--card-soft: #eaf0eb;
--card-ink: #17211b;
display: grid;
min-width: 0;
overflow: hidden;
border: 1px solid rgba(25, 35, 29, .1);
border-radius: 25px;
background: #fff;
box-shadow: 0 18px 55px rgba(30, 42, 34, .08);
color: var(--card-ink);
isolation: isolate;
grid-column: 1 / -1;
width: 100%;
max-width: none;
grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
}
.paai-card.paai-layout-compact,
.paai-card.paai-layout-standard,
.paai-card.paai-layout-featured,
.paai-card.paai-layout-premium,
.paai-card.paai-layout-compact:only-child,
.paai-card.paai-layout-standard:only-child,
.paai-listings[data-count="1"] .paai-card,
.paai-listings[data-count="1"] .paai-card.paai-layout-compact,
.paai-listings[data-count="1"] .paai-card.paai-layout-standard {
grid-column: 1 / -1;
width: 100%;
max-width: none;
grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
}
.paai-card.paai-layout-compact .paai-card__body { padding: 22px; }
.paai-card.paai-layout-compact .paai-card__title { font-size: 23px; }
.paai-card.paai-layout-compact .paai-card__summary { font-size: 14px; }
.paai-card.paai-layout-premium {
border: 2px solid color-mix(in srgb, var(--card-accent) 62%, #fff);
box-shadow: 0 25px 75px rgba(21,33,26,.16);
}
.paai-palette-ocean { --card-accent: #176b78; --card-soft: #e3f1f2; --card-ink: #12333a; }
.paai-palette-sand { --card-accent: #936b32; --card-soft: #f5ecdc; --card-ink: #342719; }
.paai-palette-plum { --card-accent: #7a4266; --card-soft: #f3e6ef; --card-ink: #311e2b; }
.paai-palette-midnight { --card-accent: #d0ab63; --card-soft: #232937; --card-ink: #f9f5ec; background: #171c27; border-color: rgba(255,255,255,.11); }
.paai-palette-terracotta { --card-accent: #a64e35; --card-soft: #f7e5df; --card-ink: #3c2018; }
.paai-card__media {
position: relative;
min-height: 330px;
overflow: hidden;
background: var(--card-soft);
aspect-ratio: 16 / 10;
}
.paai-card__hero {
display: block;
width: 100%;
height: 100%;
min-height: inherit;
object-fit: contain;
object-position: center;
background: var(--card-soft);
transition: opacity .18s ease;
}
.paai-card__hero.is-changing {
opacity: .28;
}
.paai-focus-center { object-position: center; }
.paai-focus-top,
.paai-focus-bottom,
.paai-focus-left,
.paai-focus-right { object-position: center; }
.paai-card__media::after {
position: absolute;
inset: auto 0 0;
height: 34%;
background: linear-gradient(transparent, rgba(0, 0, 0, .34));
content: "";
pointer-events: none;
}
.paai-card__gallery {
position: absolute;
z-index: 2;
left: 50%;
bottom: 14px;
display: flex;
max-width: calc(100% - 128px);
gap: 7px;
overflow-x: auto;
padding: 3px;
scrollbar-width: none;
transform: translateX(-50%);
}
.paai-card__gallery::-webkit-scrollbar {
display: none;
}
.paai-card__thumb {
appearance: none;
width: 55px;
height: 55px;
flex: 0 0 55px;
margin: 0;
overflow: hidden;
border: 2px solid rgba(255,255,255,.82);
border-radius: 12px;
background: rgba(18,25,21,.5);
box-shadow: 0 7px 20px rgba(0,0,0,.18);
cursor: pointer;
opacity: .82;
padding: 0;
transition: border-color .18s ease, opacity .18s ease, transform .18s ease;
}
.paai-card__thumb:hover,
.paai-card__thumb.is-active {
border-color: #fff;
opacity: 1;
transform: translateY(-2px);
}
.paai-card__thumb.is-active {
box-shadow: 0 0 0 2px var(--card-accent), 0 8px 22px rgba(0,0,0,.24);
}
.paai-card__thumb:focus-visible,
.paai-card__gallery-arrow:focus-visible {
outline: 3px solid #fff;
outline-offset: 2px;
}
.paai-card__thumb img {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
background: var(--card-soft);
}
.paai-card__gallery-arrow {
appearance: none;
position: absolute;
z-index: 3;
top: 50%;
display: grid;
width: 42px;
height: 42px;
margin: 0;
place-items: center;
border: 1px solid rgba(255,255,255,.42);
border-radius: 50%;
background: rgba(17,24,20,.58);
color: #fff;
cursor: pointer;
font: 400 32px/1 sans-serif;
padding: 0 0 3px;
transform: translateY(-50%);
transition: background .18s ease, transform .18s ease;
backdrop-filter: blur(8px);
}
.paai-card__gallery-arrow:hover {
background: var(--card-accent);
transform: translateY(-50%) scale(1.06);
}
.paai-card__gallery-arrow--prev { left: 14px; }
.paai-card__gallery-arrow--next { right: 14px; }
.paai-card__gallery-count {
position: absolute;
z-index: 2;
bottom: 20px;
left: 17px;
border: 1px solid rgba(255,255,255,.32);
border-radius: 999px;
background: rgba(17,24,20,.58);
color: #fff;
font-size: 11px;
font-weight: 750;
line-height: 1;
padding: 7px 9px;
backdrop-filter: blur(8px);
}
.paai-card__sponsored {
position: absolute;
z-index: 2;
top: 13px;
left: 13px;
border: 1px solid rgba(255,255,255,.35);
border-radius: 999px;
background: rgba(20,25,22,.56);
color: #fff;
font-size: 10px;
font-weight: 750;
letter-spacing: .055em;
padding: 6px 9px;
text-transform: uppercase;
backdrop-filter: blur(10px);
}
.paai-card__premium {
position: absolute;
z-index: 2;
top: 13px;
right: 13px;
border-radius: 999px;
background: #f2d58b;
box-shadow: 0 6px 22px rgba(0,0,0,.18);
color: #35270b;
font-size: 10px;
font-weight: 850;
letter-spacing: .045em;
padding: 7px 10px;
text-transform: uppercase;
}
.paai-card__body {
display: flex;
min-width: 0;
flex-direction: column;
padding: clamp(22px, 3vw, 34px);
}
.paai-card__eyebrow {
margin-bottom: 9px;
color: var(--card-accent);
font-size: 11px;
font-weight: 850;
letter-spacing: .11em;
text-transform: uppercase;
}
.paai-card__title {
margin: 0 0 12px;
color: var(--card-ink);
font: 750 clamp(22px, 2.4vw, 32px)/1.08 inherit;
letter-spacing: -.035em;
}
.paai-listings:not([data-count="1"]) .paai-card__title {
font-size: clamp(21px, 2vw, 27px);
}
.paai-card__summary {
margin: 0 0 18px;
color: color-mix(in srgb, var(--card-ink) 72%, transparent);
font-size: 15px;
line-height: 1.62;
}
.paai-card__highlights {
display: flex;
flex-wrap: wrap;
gap: 7px;
margin: 0 0 19px;
padding: 0;
list-style: none;
}
.paai-card__highlights li {
border-radius: 999px;
background: var(--card-soft);
color: var(--card-ink);
font-size: 12px;
font-weight: 680;
line-height: 1.2;
padding: 8px 10px;
}
.paai-card__details {
display: grid;
gap: 7px;
margin: 0 0 22px;
}
.paai-card__details a,
.paai-card__details span {
overflow: hidden;
color: color-mix(in srgb, var(--card-ink) 72%, transparent);
font-size: 13px;
line-height: 1.35;
text-decoration: none;
text-overflow: ellipsis;
white-space: nowrap;
}
.paai-card__details a:hover {
color: var(--card-accent);
}
.paai-card__footer {
display: flex;
align-items: center;
justify-content: space-between;
gap: 13px;
margin-top: auto;
padding-top: 17px;
border-top: 1px solid color-mix(in srgb, var(--card-ink) 12%, transparent);
}
.paai-card__brand {
overflow: hidden;
font-size: 14px;
text-overflow: ellipsis;
white-space: nowrap;
}
.paai-card__cta {
flex: 0 0 auto;
border-radius: 999px;
background: var(--card-accent);
color: #fff !important;
font-size: 13px;
font-weight: 750;
padding: 10px 13px;
text-decoration: none !important;
}
.paai-card__cta:hover {
filter: brightness(.94);
}
.paai-variant-editorial .paai-card__title {
font-family: Georgia, "Times New Roman", serif;
font-weight: 600;
letter-spacing: -.025em;
}
.paai-variant-bold .paai-card__body {
background: linear-gradient(145deg, var(--card-soft), transparent 75%);
}
.paai-variant-warm {
border-radius: 34px 12px 34px 12px;
}
.paai-palette-midnight .paai-card__summary,
.paai-palette-midnight .paai-card__details a,
.paai-palette-midnight .paai-card__details span {
color: rgba(249,245,236,.72);
}
.paai-zone__sell {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
padding: 15px 10px 0;
color: var(--paai-muted);
font-size: 13px;
}
.paai-link-button,
.paai-back {
appearance: none;
border: 0;
background: transparent;
color: var(--paai-accent);
cursor: pointer;
font: 750 13px/1 inherit;
padding: 7px;
}
.paai-modal[hidden],
.paai-step[hidden] {
display: none !important;
}
.paai-modal {
position: fixed;
z-index: 999999;
inset: 0;
display: grid;
padding: 18px;
place-items: center;
}
.paai-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(11, 18, 14, .72);
backdrop-filter: blur(9px);
}
.paai-modal__panel {
position: relative;
z-index: 1;
width: min(980px, 100%);
max-height: calc(100vh - 36px);
overflow: auto;
border: 1px solid rgba(255,255,255,.35);
border-radius: 26px;
background: #fbfbf8;
box-shadow: 0 32px 100px rgba(0,0,0,.34);
padding: clamp(22px, 4vw, 42px);
animation: paai-modal-in .24s ease both;
}
@keyframes paai-modal-in {
from { opacity: 0; transform: translateY(10px) scale(.985); }
to { opacity: 1; transform: translateY(0) scale(1); }
}
.paai-modal .paai-modal__close {
appearance: none !important;
position: absolute;
top: 14px !important;
right: 14px !important;
display: flex !important;
width: 40px !important;
min-width: 40px !important;
max-width: 40px !important;
height: 40px !important;
min-height: 40px !important;
max-height: 40px !important;
align-items: center !important;
justify-content: center !important;
margin: 0 !important;
border: 1px solid rgba(24, 33, 28, .18) !important;
border-radius: 999px !important;
background: #fff !important;
box-shadow: 0 7px 20px rgba(17, 26, 21, .12) !important;
color: #17211b !important;
cursor: pointer;
font: 400 26px/1 Arial, sans-serif !important;
padding: 0 0 3px !important;
text-align: center !important;
text-indent: 0 !important;
transform: none !important;
}
.paai-modal .paai-modal__close > span {
display: block !important;
width: 1em !important;
height: 1em !important;
margin: 0 !important;
color: inherit !important;
font: inherit !important;
line-height: .9 !important;
}
.paai-modal .paai-modal__close:hover {
border-color: rgba(31, 111, 84, .48) !important;
background: #edf6f1 !important;
color: #15563f !important;
}
.paai-modal__intro > span {
color: var(--paai-accent);
font-size: 11px;
font-weight: 850;
letter-spacing: .11em;
text-transform: uppercase;
}
.paai-modal__intro h2 {
max-width: 620px;
margin: 6px 46px 8px 0;
color: var(--paai-ink);
font: 750 clamp(25px, 4vw, 36px)/1.08 inherit;
letter-spacing: -.035em;
}
.paai-modal__intro p {
max-width: 650px;
margin: 0;
color: var(--paai-muted);
font-size: 14px;
line-height: 1.55;
}
.paai-progress {
display: flex;
align-items: center;
width: min(330px, 86%);
margin: 25px 0 22px;
}
.paai-progress span {
display: grid;
width: 28px;
height: 28px;
flex: 0 0 auto;
place-items: center;
border: 1px solid var(--paai-border);
border-radius: 50%;
background: #fff;
color: var(--paai-muted);
font-size: 12px;
font-weight: 800;
}
.paai-progress span.is-active,
.paai-progress span.is-done {
border-color: var(--paai-accent);
background: var(--paai-accent);
color: #fff;
}
.paai-progress i {
height: 1px;
flex: 1 1 auto;
background: var(--paai-border);
}
.paai-step {
min-width: 0;
margin: 0;
padding: 0;
border: 0;
}
.paai-step legend {
width: 100%;
margin-bottom: 15px;
color: var(--paai-ink);
font-size: 17px;
font-weight: 800;
}
.paai-plan-intro { margin: -6px 0 16px; color: var(--paai-muted); font-size: 13px; line-height: 1.5; }
.paai-plan-picker { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.paai-plan-option {
position: relative;
display: flex !important;
min-width: 0;
flex-direction: column;
gap: 8px !important;
margin: 0 !important;
border: 1px solid rgba(24,33,28,.13);
border-radius: 16px;
background: #fff;
cursor: pointer;
padding: 15px;
transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.paai-plan-option:hover,
.paai-plan-option.is-selected { border-color: var(--paai-accent); box-shadow: 0 10px 28px rgba(31,111,84,.10); transform: translateY(-1px); }
.paai-plan-option input,
.paai-duration-option input { position: absolute; opacity: 0; pointer-events: none; }
.paai-plan-option__top { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.paai-plan-option__top strong { color: var(--paai-ink); font-size: 16px; }
.paai-plan-option__top em { border-radius: 999px; background: #dceee5; color: #1f6f54; font-size: 9px; font-style: normal; font-weight: 800; padding: 5px 7px; text-transform: uppercase; }
.paai-plan-option__tagline { min-height: 32px; color: var(--paai-muted) !important; font-size: 11px !important; font-weight: 550 !important; line-height: 1.4; }
.paai-plan-option > b { color: var(--paai-accent); font-size: 17px; }
.paai-plan-option > b small { color: var(--paai-muted); font-size: 10px; font-weight: 550; }
.paai-plan-option ul { display: grid; gap: 6px; margin: 1px 0 0; padding: 0; list-style: none; }
.paai-plan-option li { color: #46534b; font-size: 10px; line-height: 1.35; }
.paai-plan-option li::before { color: var(--paai-accent); content: "✓ "; font-weight: 900; }
.paai-form-section-title { margin: 22px 0 11px; color: var(--paai-ink); font-size: 14px; }
.paai-duration-picker { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.paai-duration-option {
position: relative;
display: block !important;
margin: 0 !important;
border: 1px solid rgba(24,33,28,.13);
border-radius: 12px;
background: #fff;
cursor: pointer;
padding: 10px 8px;
text-align: center;
}
.paai-duration-option.is-selected { border-color: var(--paai-accent); background: #eaf2ed; }
.paai-duration-option span { font-size: 12px !important; }
.paai-addon-option {
display: flex !important;
align-items: flex-start;
gap: 10px !important;
margin: 13px 0 !important;
border: 1px solid rgba(31,111,84,.22);
border-radius: 13px;
background: rgba(31,111,84,.045);
cursor: pointer;
padding: 12px 13px;
}
.paai-addon-option input { width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--paai-accent); }
.paai-addon-option > span { display: grid; gap: 3px; }
.paai-addon-option small { color: var(--paai-muted); font-weight: 500; }
.paai-plan-live-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-radius: 14px; background: #18211c; color: #fff; padding: 13px 15px; }
.paai-plan-live-summary > div { display: grid; gap: 3px; }
.paai-plan-live-summary span { color: rgba(255,255,255,.65); font-size: 10px; font-weight: 700; text-transform: uppercase; }
.paai-plan-live-summary strong { font-size: 13px; }
.paai-plan-live-summary > b { color: #8bd9b5; font-size: 20px; }
.paai-ai-helper { display: flex; align-items: center; gap: 12px; margin: 2px 0 14px; }
.paai-ai-button { flex: 0 0 auto; border: 0; border-radius: 999px; background: #e7e5f7; color: #423b79; cursor: pointer; font: 750 12px/1 inherit; padding: 10px 13px; }
.paai-ai-button:disabled { cursor: wait; opacity: .65; }
.paai-ai-helper > span { color: var(--paai-muted); font-size: 11px; font-weight: 500; line-height: 1.4; }
.paai-ai-status { display: none; margin: 0 0 14px; border-radius: 13px; font-size: 12px; padding: 12px; }
.paai-ai-status.is-loading,
.paai-ai-status.is-success,
.paai-ai-status.is-error { display: grid; gap: 9px; }
.paai-ai-status.is-loading { background: #ecebf8; color: #423b79; }
.paai-ai-status.is-success { background: #e7f2eb; color: #205c46; }
.paai-ai-status.is-error { background: #fbe8e5; color: #8b2d20; }
.paai-ai-status p { margin: 0; }
.paai-ai-status small { line-height: 1.45; }
.paai-ai-research-note { border-top: 1px solid rgba(31,111,84,.16); padding-top: 8px; font-style: italic; }
.paai-ai-sources { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.paai-ai-sources strong { margin-right: 2px; font-size: 10px; text-transform: uppercase; }
.paai-ai-sources a { border-radius: 999px; background: #fff; color: #1f5f49; font-size: 10px; padding: 6px 8px; text-decoration: underline; }
.paai-ai-title-options { display: flex; flex-wrap: wrap; gap: 6px; }
.paai-ai-title-options button { border: 1px solid rgba(31,111,84,.28); border-radius: 999px; background: #fff; color: #1f5f49; cursor: pointer; font: 650 11px/1.2 inherit; padding: 8px 10px; }
.paai-ai-title-options button.is-selected { background: #1f6f54; color: #fff; }
.paai-fields {
display: grid;
gap: 15px;
}
.paai-fields--two {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.paai-form label:not(.paai-upload):not(.paai-consent):not(.paai-honeypot):not(.paai-plan-option):not(.paai-duration-option):not(.paai-addon-option) {
display: grid;
gap: 7px;
margin-bottom: 15px;
}
.paai-form label > span {
color: #334139;
font-size: 12px;
font-weight: 750;
}
.paai-form input[type="text"],
.paai-form input[type="tel"],
.paai-form input[type="email"],
.paai-form textarea {
width: 100%;
margin: 0;
border: 1px solid rgba(24,33,28,.16);
border-radius: 12px;
background: #fff;
color: var(--paai-ink);
font: 400 15px/1.4 inherit;
padding: 12px 13px;
box-shadow: none;
}
.paai-form textarea {
min-height: 90px;
resize: vertical;
}
.paai-form input:focus,
.paai-form textarea:focus {
border-color: var(--paai-accent);
box-shadow: 0 0 0 3px rgba(31,111,84,.11);
}
.paai-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 10px;
margin-top: 19px;
}
.paai-upload {
display: grid;
min-height: 145px;
place-items: center;
align-content: center;
border: 1.5px dashed rgba(31,111,84,.42);
border-radius: 17px;
background: rgba(31,111,84,.045);
cursor: pointer;
padding: 20px;
text-align: center;
}
.paai-upload input {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
opacity: 0;
}
.paai-upload strong {
color: var(--paai-accent);
font-size: 16px;
}
.paai-upload span {
max-width: 470px;
margin-top: 5px;
color: var(--paai-muted) !important;
font-weight: 450 !important;
line-height: 1.45;
}
.paai-previews {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 11px;
}
.paai-previews figure {
position: relative;
width: 68px;
height: 68px;
margin: 0;
overflow: hidden;
border-radius: 11px;
background: #e8ece9;
}
.paai-previews img {
width: 100%;
height: 100%;
object-fit: contain;
background: #eef1ef;
}
.paai-preview-remove {
appearance: none;
position: absolute;
top: 4px;
right: 4px;
display: grid;
width: 23px;
height: 23px;
margin: 0;
place-items: center;
border: 1px solid rgba(255,255,255,.75);
border-radius: 50%;
background: rgba(20,27,23,.82);
color: #fff;
cursor: pointer;
font: 700 16px/1 sans-serif;
padding: 0 0 2px;
}
.paai-preview-remove:hover { background: #8b2d20; }
.paai-consent {
display: flex;
align-items: flex-start;
gap: 9px;
margin-top: 17px;
color: var(--paai-muted);
font-size: 12px;
line-height: 1.45;
}
.paai-consent input {
width: 17px;
height: 17px;
flex: 0 0 auto;
margin-top: 1px;
accent-color: var(--paai-accent);
}
.paai-consent a {
color: var(--paai-accent);
}
.paai-checkout-summary {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 16px;
border-radius: 13px;
background: #eef2ee;
padding: 12px 14px;
}
.paai-checkout-summary span {
color: var(--paai-muted);
font-size: 12px;
font-weight: 750;
text-transform: uppercase;
}
.paai-checkout-summary strong {
color: var(--paai-ink);
font-size: 21px;
}
.paai-form-status {
display: none;
margin-top: 12px;
border-radius: 10px;
font-size: 13px;
padding: 10px 12px;
}
.paai-form-status.is-info,
.paai-form-status.is-error {
display: block;
}
.paai-form-status.is-info { background: #e8f1ec; color: #205c46; }
.paai-form-status.is-error { background: #fbe8e5; color: #8b2d20; }
.paai-submit:disabled {
cursor: wait;
opacity: .65;
}
.paai-payment-note {
display: block;
margin-top: 11px;
color: var(--paai-muted);
font-size: 10px;
line-height: 1.45;
text-align: right;
}
.paai-honeypot {
position: absolute !important;
left: -10000px !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
}
.paai-toast {
position: fixed;
z-index: 1000000;
right: 20px;
bottom: 20px;
display: flex;
width: min(430px, calc(100vw - 40px));
align-items: flex-start;
gap: 10px;
border-radius: 15px;
background: #18211c;
box-shadow: 0 18px 55px rgba(0,0,0,.25);
color: #fff;
font: 600 14px/1.45 system-ui, sans-serif;
padding: 15px;
}
.paai-toast button {
appearance: none;
display: grid;
width: 28px;
min-width: 28px;
height: 28px;
place-items: center;
order: 2;
margin-left: auto;
border: 1px solid rgba(255, 255, 255, .22);
border-radius: 50%;
background: rgba(0, 0, 0, .12);
color: inherit;
cursor: pointer;
font: 400 20px/1 Arial, sans-serif;
padding: 0 0 2px;
text-align: center;
transform: none;
}
.paai-toast button:hover { background: rgba(255, 255, 255, .16); }
.paai-toast--success { background: #1d624a; }
.paai-toast--error { background: #8b2d20; }
@media (min-width: 761px) {
.paai-card__media { align-self: stretch; }
.paai-card__body { min-height: 330px; }
}
@media (max-width: 760px) {
.paai-listings {
grid-template-columns: 1fr;
}
.paai-card,
.paai-card.paai-layout-compact,
.paai-card.paai-layout-standard,
.paai-card.paai-layout-featured,
.paai-card.paai-layout-premium,
.paai-card.paai-layout-compact:only-child,
.paai-card.paai-layout-standard:only-child,
.paai-listings[data-count="1"] .paai-card,
.paai-listings[data-count="1"] .paai-card.paai-layout-compact,
.paai-listings[data-count="1"] .paai-card.paai-layout-standard {
grid-template-columns: 1fr;
}
.paai-card__media,
.paai-listings[data-count="1"] .paai-card__media {
min-height: 0;
aspect-ratio: 16 / 10;
}
.paai-zone__header {
align-items: flex-start;
}
.paai-publish-button {
padding: 12px 15px;
white-space: nowrap;
}
.paai-fields--two {
grid-template-columns: 1fr;
gap: 0;
}
.paai-plan-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.paai-modal {
padding: 8px;
}
.paai-modal__panel {
max-height: calc(100vh - 16px);
border-radius: 20px;
}
}
@media (max-width: 520px) {
.paai-zone__header {
display: grid;
}
.paai-publish-button {
width: 100%;
}
.paai-zone__sell {
display: grid;
text-align: center;
}
.paai-card__footer {
align-items: flex-start;
flex-direction: column;
}
.paai-card__cta {
width: 100%;
text-align: center;
}
.paai-card__gallery {
max-width: calc(100% - 102px);
}
.paai-card__thumb {
width: 48px;
height: 48px;
flex-basis: 48px;
}
.paai-card__gallery-arrow {
width: 38px;
height: 38px;
}
.paai-actions {
align-items: stretch;
flex-direction: column-reverse;
}
.paai-actions button {
width: 100%;
}
.paai-plan-picker,
.paai-duration-picker { grid-template-columns: 1fr; }
.paai-ai-helper { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
.paai-card__hero,
.paai-publish-button,
.paai-next,
.paai-submit,
.paai-modal__panel {
animation: none !important;
transition: none !important;
}
} .paai-zone__header {
padding: clamp(20px, 3vw, 32px);
border: 1px solid #c4d5b6;
border-radius: 24px;
background: radial-gradient(ellipse at 95% 0%, #e0eac4, transparent 65%), #faf8ed;
box-shadow: 0 14px 36px rgb(20 59 46 / 8%);
}
.paai-zone .paai-zone__header h2 { color: #143b2e !important; text-shadow: none; }
.paai-zone .paai-zone__header .paai-zone__kicker { color: #185c40 !important; }
.paai-zone .paai-zone__header .paai-publish-button {
min-height: 48px;
flex-shrink: 0;
background: #185c40 !important;
color: #fff !important;
box-shadow: 0 0 0 6px rgb(24 92 64 / 7%), 0 9px 24px rgb(24 92 64 / 18%);
white-space: normal;
line-height: 1.4;
}
.paai-zone .paai-zone__header .paai-publish-button:hover { background: #103e2b !important; transform: none; }
.paai-modal__panel {
--paai-ink: #143b2e;
--paai-muted: #466251;
--paai-accent: #185c40;
background: radial-gradient(ellipse at 100% 0%, #edf1db, transparent 55%), #faf8ed;
max-height: calc(100dvh - 36px);
overscroll-behavior: contain;
scroll-padding-block: 64px;
}
.paai-modal .paai-modal__close {
position: sticky;
top: 0 !important;
float: right;
z-index: 5;
width: 44px !important;
min-width: 44px !important;
max-width: 44px !important;
height: 44px !important;
min-height: 44px !important;
max-height: 44px !important;
}
.paai-modal__intro { padding-right: 54px; }
.paai-zone :is(button, a, input, textarea, select):focus-visible {
outline: 3px solid #185c40;
outline-offset: 4px;
}
.paai-plan-option:focus-within, .paai-duration-option:focus-within { outline: 3px solid #185c40; outline-offset: 3px; }
.paai-plan-option__tagline { font-size: 14px !important; }
.paai-plan-option li, .paai-plan-option > b small { font-size: 13px; line-height: 1.5; }
.paai-plan-option__top { flex-wrap: wrap; }
.paai-plan-option__top em { font-size: 11px; }
.paai-plan-option, .paai-duration-option, .paai-next, .paai-back, .paai-submit { min-height: 44px; }
.paai-modal :is(input[type='text'], input[type='tel'], input[type='email'], textarea, select) { font-size: 16px; }
.paai-modal :is(.paai-fields, .paai-plan-picker) > * { min-width: 0; }
.paai-text-preview {
margin-block: 24px;
padding: clamp(18px, 3vw, 26px);
border: 1px solid #bbccb0;
border-radius: 18px;
background: #fffef9;
color: #143b2e;
overflow-wrap: anywhere;
}
.paai-text-preview small { color: #466251; font-size: 11px; letter-spacing: .07em; }
.paai-text-preview h3 { margin: 14px 0 8px; color: #143b2e; font-size: 22px; line-height: 1.25; }
.paai-text-preview p { margin: 8px 0; color: #466251; white-space: pre-line; font-size: 15px; line-height: 1.6; }
.paai-text-preview [hidden] { display: none; }
@media (max-width: 640px) {
.paai-zone__header { align-items: stretch; flex-direction: column; gap: 20px; }
.paai-zone .paai-zone__header .paai-publish-button { width: 100%; }
.paai-modal { padding: 8px; }
.paai-modal__panel { max-height: calc(100dvh - 16px); padding: 18px; border-radius: 20px; }
.paai-modal__intro h2 { font-size: 27px; }
}
@media (prefers-reduced-motion: reduce) {
.paai-zone *, .paai-zone *::before, .paai-zone *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
.paai-zone__header, .paai-text-preview { border-color: CanvasText; }
.paai-zone :is(button, a, input, textarea, select):focus-visible { outline-color: Highlight; }
} .paai-zone .paai-zone__sell {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
padding: clamp(22px, 4vw, 34px);
border: 1px solid #c4d5b6;
border-radius: 22px;
background: radial-gradient(ellipse at 90% 15%, rgb(202 222 157 / 55%), transparent 65%), #faf8ed;
color: #143b2e !important;
box-shadow: 0 14px 36px rgb(20 59 46 / 8%);
}
.paai-zone .paai-zone__sell .paai-invite-copy { display: grid; gap: 10px; min-width: 0; text-align: left; }
.paai-zone .paai-zone__sell .paai-invite-copy > strong { display: block; color: #143b2e; font-size: 20px; line-height: 1.3; font-weight: 750; }
.paai-zone .paai-zone__sell .paai-invite-copy > span { display: block; color: #466251; font-size: 16px; line-height: 1.6; }
.paai-zone .paai-zone__sell .paai-link-button {
display: inline-flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
min-height: 48px;
padding: 14px 22px;
border: 2px solid #185c40;
border-radius: 999px;
background: #185c40;
color: #fff !important;
font-size: 16px;
font-weight: 750;
line-height: 1.4;
text-decoration: none;
white-space: normal;
box-shadow: 0 0 0 6px rgb(24 92 64 / 7%), 0 9px 24px rgb(24 92 64 / 16%);
}
.paai-zone .paai-zone__sell .paai-link-button:hover { background: #103e2b; border-color: #103e2b; color: #fff !important; }
@media (max-width: 740px) {
.paai-zone .paai-zone__sell { flex-direction: column; align-items: stretch; }
.paai-zone .paai-zone__sell .paai-link-button { width: 100%; }
} .paai-zone .paai-modal .paai-modal__panel { color: #143b2e !important; }
.paai-zone .paai-modal .paai-modal__panel :is(h1, h2, h3, h4, h5, h6, legend, label) {
color: #143b2e !important;
text-shadow: none !important;
}
.paai-zone .paai-modal .paai-modal__panel :is(label > span, label > strong, label > b, .paai-form-section-title) {
color: #143b2e !important;
}
.paai-zone .paai-modal .paai-modal__panel :is(.paai-modal__intro p, .paai-plan-intro, .paai-plan-option__tagline, .paai-plan-option li, .paai-upload > span, .paai-payment-note, .paai-consent span, .paai-text-preview p) {
color: #466251 !important;
}
.paai-zone .paai-modal .paai-modal__panel :is(input, textarea, select) { color: #143b2e !important; }
.paai-zone .paai-modal .paai-modal__panel :is(input, textarea)::placeholder { color: #526959 !important; opacity: 1; }
.paai-zone .paai-modal .paai-modal__panel a { color: #185c40 !important; text-decoration: underline; } .paai-zone .paai-modal .paai-plan-live-summary strong { color: #fff !important; }
.paai-zone .paai-modal .paai-plan-live-summary span { color: #d5e7dd !important; }
.paai-zone .paai-modal .paai-plan-live-summary > b { color: #a6efc9 !important; }
.paai-zone .paai-modal { z-index: 2147483000; } html.paai-modal-open #aviso-spa-flotante { visibility: hidden !important; pointer-events: none !important; } .paai-zone .paai-owner-tab {
display: none;
position: fixed;
right: 0;
top: 58%;
z-index: 10020;
width: auto;
max-width: 180px;
min-height: 44px;
padding: 12px 17px;
border: 1px solid #b7cda6;
border-right: 0;
border-radius: 16px 0 0 16px;
background: #f7f5e9;
color: #185c40 !important;
box-shadow: -4px 5px 18px rgb(20 59 46 / 12%);
font: 700 14px/1.4 inherit;
cursor: pointer;
white-space: normal;
}
.paai-zone .paai-owner-tab.is-scroll-visible { display: block; }
.paai-zone .paai-owner-teaser {
position: fixed;
right: 18px;
bottom: max(24px, env(safe-area-inset-bottom));
z-index: 10025;
width: min(380px, calc(100vw - 32px));
max-height: calc(100dvh - 48px);
overflow-y: auto;
overscroll-behavior: contain;
padding: 26px;
border: 1px solid #b7cda6;
border-radius: 22px;
background: radial-gradient(ellipse at 100% 0%, #e4edce, transparent 65%), #faf8ed;
color: #143b2e !important;
box-shadow: 0 18px 54px rgb(20 59 46 / 22%);
text-align: left;
}
.paai-zone .paai-owner-teaser[hidden] { display: none !important; }
.paai-zone .paai-owner-teaser :is(h2, h3, strong) { color: #143b2e !important; text-shadow: none; }
.paai-zone .paai-owner-teaser :is(h2, h3) { margin: 0 30px 12px 0; font-size: 23px; line-height: 1.25; }
.paai-zone .paai-owner-teaser p { color: #466251 !important; font-size: 16px; line-height: 1.6; margin: 12px 0; }
.paai-zone .paai-owner-teaser [data-paai-teaser-close] {
position: absolute;
right: 8px;
top: 8px;
display: grid;
place-items: center;
width: 44px;
height: 44px;
padding: 0;
border: 1px solid transparent;
border-radius: 50%;
background: transparent;
color: #143b2e !important;
font-size: 26px;
cursor: pointer;
}
.paai-zone .paai-owner-teaser [data-paai-open] {
display: inline-flex;
justify-content: center;
align-items: center;
width: 100%;
min-height: 48px;
padding: 12px 18px;
border: 1px solid #185c40;
border-radius: 999px;
background: #185c40 !important;
color: #fff !important;
font-size: 16px;
line-height: 1.4;
font-weight: 700;
cursor: pointer;
}
html.paai-modal-open .paai-zone :is(.paai-owner-tab, .paai-owner-teaser) { visibility: hidden !important; pointer-events: none !important; }
.paai-zone .paai-provider-details { margin-block: 20px; border: 0; background: transparent; }
.paai-zone .paai-provider-details > summary {
display: list-item;
width: fit-content;
max-width: 100%;
min-height: 44px;
padding: 11px 18px;
border: 1px solid #c4d5b6;
border-radius: 999px;
background: #faf8ed;
color: #185c40 !important;
font-size: 15px;
font-weight: 650;
line-height: 1.5;
cursor: pointer;
}
.paai-zone .paai-provider-details > summary:focus-visible { outline: 3px solid #185c40; outline-offset: 4px; }
.paai-zone .paai-provider-details > .paai-zone__sell { margin-top: 16px; box-shadow: none; }
@media (max-width: 640px) {
.paai-zone .paai-owner-tab { top: 55%; max-width: 146px; padding: 10px 13px; font-size: 13px; }
.paai-zone .paai-owner-teaser { right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); padding: 22px; }
} html.paai-teaser-open #aviso-spa-flotante,
html.paai-teaser-open .paai-zone .paai-owner-tab {
visibility: hidden !important;
pointer-events: none !important;
} .paai-zone .paai-owner-tab { overflow:hidden; background:linear-gradient(120deg,#143b2e,#236650); color:#fff4c7!important; border-color:#dbc47a; box-shadow:0 5px 22px #143b2e33; font-weight:750; }
.paai-zone .paai-owner-tab::after { content:""; position:absolute; inset:-70% auto -70% -80%; width:40%; background:linear-gradient(90deg,transparent,#fff9,transparent); transform:rotate(25deg); pointer-events:none; animation:paai-glint 2.2s .8s 1 both; }
.paai-zone .paai-owner-teaser { width:min(480px,calc(100vw - 32px)); padding:20px 24px; border:1px solid #d4b866; background:radial-gradient(ellipse at 100% 0%,#d0f4e9,transparent 65%),linear-gradient(125deg,#fffdf2,#f7f6ee); box-shadow:0 14px 48px #143b2e38,0 0 0 4px #edda9b33; animation:paai-invite-enter .45s ease-out both; }
.paai-zone .paai-invite-eyebrow { display:flex; align-items:center; gap:9px; padding-right:24px; margin-bottom:10px; font-size:10px; letter-spacing:1.2px; line-height:1.4; font-weight:800; color:#37665a; }
.paai-zone .paai-invite-eyebrow img { width:28px; height:28px; object-fit:contain; border-radius:7px; flex-shrink:0; }
.paai-zone .paai-owner-teaser > strong { display:block; font-size:24px; line-height:1.2; color:#166859!important; }
.paai-zone .paai-owner-teaser p { font-size:14px; line-height:1.45; margin:9px 0; }
.paai-zone .paai-owner-teaser p + p { color:#80452b!important; font-weight:700; }
.paai-zone .paai-owner-teaser [data-paai-open] { min-height:44px; font-size:14px; background:linear-gradient(110deg,#185c40,#147864)!important; box-shadow:0 4px 12px #185c4026; }
.paai-zone :is(.paai-owner-tab,[data-paai-teaser-close],.paai-owner-teaser [data-paai-open]):focus-visible { outline:3px solid #ac6814; outline-offset:3px; }
@keyframes paai-glint { from {left:-80%} to {left:180%} }
@keyframes paai-invite-enter { from {opacity:0;transform:translateY(18px)} to {opacity:1;transform:translateY(0)} }
@media(max-width:640px) { .paai-zone .paai-owner-teaser {padding:16px 18px;right:12px;width:calc(100vw - 24px);max-height:50dvh;} .paai-zone .paai-owner-teaser > strong {font-size:21px;} }
@media(prefers-reduced-motion:reduce) { .paai-zone .paai-owner-tab::after,.paai-zone .paai-owner-teaser {animation:none!important;} } .paai-zone .paai-owner-tab { background:linear-gradient(115deg,#174b40,#106f64); border:1px solid #edcb77; border-right:0; padding:14px 20px; box-shadow:0 6px 26px #083d4666,0 0 16px #e6c47633; }
.paai-zone .paai-owner-tab::before {content:"✦ ";color:#ffe19a;}
.paai-zone .paai-owner-tab::after {animation:paai-banner-shine 5s 3 both;}
.paai-zone .paai-owner-teaser {width:min(620px,calc(100vw - 32px));display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:8px 20px;overflow:hidden;padding:22px 26px;border:1px solid #edcb77;border-radius:20px;background:radial-gradient(ellipse at 100% 0%,#157c7466,transparent 65%),linear-gradient(120deg,#102f32,#124a43);box-shadow:0 14px 42px #051e3266,0 0 24px #eac57022;animation:paai-invite-enter .6s ease-out both;}
.paai-zone .paai-owner-teaser::after {content:"";position:absolute;top:-100%;bottom:-100%;left:-80%;width:25%;background:linear-gradient(90deg,transparent,#fff2,transparent);transform:rotate(25deg);pointer-events:none;animation:paai-banner-shine 5s 3 both;}
.paai-zone .paai-owner-teaser .paai-invite-eyebrow {grid-column:1/-1;color:#a6efdb!important;font-size:10px;margin:0 25px 3px 0;letter-spacing:1.5px;}
.paai-zone .paai-invite-eyebrow img {background:#fff;padding:3px;box-sizing:content-box;}
.paai-zone .paai-owner-teaser > strong {grid-column:1;font-size:27px;color:#fff0bc!important;}
.paai-zone .paai-owner-teaser > p {grid-column:1;color:#e0f2eb!important;font-size:14px;line-height:1.5;margin:0;}
.paai-zone .paai-owner-teaser > p + p {grid-column:2;grid-row:2 / span 2;align-self:center;color:#ffe19a!important;font-size:17px;line-height:1.5;}
.paai-zone .paai-owner-teaser [data-paai-open] {grid-column:1/-1;position:relative;margin-top:5px;background:linear-gradient(105deg,#ffe5a1,#efc36a)!important;color:#173c35!important;border:0;border-radius:12px;font-weight:800;box-shadow:0 3px 16px #f5cf7540;z-index:1;}
.paai-zone .paai-owner-teaser [data-paai-teaser-close] {color:#fff!important;background:#ffffff12;z-index:2;}
.paai-zone .paai-modal .paai-modal__panel p.paai-scope-note {color:#294b41!important;opacity:1;text-shadow:none;}
@keyframes paai-banner-shine {0%,18%{left:-80%}58%,100%{left:180%}}
@media(max-width:640px){.paai-zone .paai-owner-teaser{grid-template-columns:minmax(0,1fr);gap:7px;padding:17px 19px;width:calc(100vw - 24px);overflow-y:auto;max-height:50dvh;}.paai-zone .paai-owner-teaser > strong{font-size:23px}.paai-zone .paai-owner-teaser > p + p{grid-column:1;grid-row:auto;font-size:15px}.paai-zone .paai-owner-teaser .paai-invite-eyebrow{font-size:9px;letter-spacing:1px}}
@media(prefers-reduced-motion:reduce){.paai-zone .paai-owner-teaser::after,.paai-zone .paai-owner-tab::after{animation:none!important;display:none}}
.paai-zone .paai-modal .paai-modal__panel p.paai-plan-terms { color:#243e35!important; opacity:1; text-shadow:none; font-weight:600; line-height:1.6; }
.paai-zone .paai-modal .paai-duration-option[hidden] { display:none!important; }
.paai-zone .paai-modal .paai-modal__panel .paai-ai-status {color:#244438!important;opacity:1;text-shadow:none;font-weight:600;}
.paai-zone .paai-modal .paai-modal__panel .paai-ai-status.is-success {color:#175333!important;background:#e8f3e9;}
.paai-zone .paai-modal .paai-modal__panel .paai-ai-status.is-error {color:#862b25!important;background:#fff0ec;}
.paai-zone .paai-modal .paai-modal__panel .paai-ai-status :is(p,small,strong,span) {color:#193e2c!important;opacity:1;text-shadow:none;}
.paai-zone .paai-modal .paai-modal__panel .paai-ai-title-options {display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 16px;}
.paai-zone .paai-modal .paai-modal__panel .paai-ai-title-options button {color:#194b36!important;background:#fff!important;border:1px solid #759780;border-radius:10px;padding:10px 13px;min-height:44px;font:inherit;line-height:1.4;text-align:left;cursor:pointer;white-space:normal;}
.paai-zone .paai-modal .paai-modal__panel .paai-ai-title-options button:is(:hover,.is-selected) {color:#fff!important;background:#205c40!important;}
.paai-zone .paai-modal .paai-modal__panel .paai-ai-title-options button:focus-visible {outline:3px solid #a96812;outline-offset:2px;}
.paai-zone .paai-modal .paai-modal__panel .paai-ai-status small {display:block;margin:8px 0;font-size:13px;line-height:1.5;}