/* Approved design pass: WorkAid surfaces, hierarchy and responsive composition. */
:root { --section-space: clamp(72px, 8vw, 112px); }
body { background: #FAFBFC; }
h1, h2 { letter-spacing: -.035em; }
h2 { font-size: clamp(32px, 3.3vw, 42px); line-height: 1.14; }
p { text-wrap: pretty; }
.section { padding: var(--section-space) 0; }
.section-head { margin-bottom: 48px; }
.eyebrow { font-size: 12px; letter-spacing: .12em; margin-bottom: 18px; }
.lede { line-height: 1.65; }
main, section[id] { scroll-margin-top: 96px; }
.header { background: rgba(250,251,252,.94); border-bottom: 1px solid rgba(217,225,230,.55); }
.header__inner { height: 80px; gap: 20px; }
.logo { flex: 0 0 auto; }
.logo img { width: 143px; height: auto; max-width: none; }
.nav { gap: 22px; }
.nav a { font-size: 14px; position: relative; padding: 10px 0; }
.nav a::after { content: ''; position: absolute; bottom: 3px; left: 0; right: 0; height: 1px; background: var(--navy); transform: scaleX(0); transform-origin: left; transition: transform .2s; }
.nav a:hover::after { transform: scaleX(1); }
.btn { height: 50px; font-size: 14px; gap: 12px; }
.btn--sm { height: 42px; }
.btn--primary { background: linear-gradient(135deg, var(--teal), var(--teal-hover)); box-shadow: 0 5px 12px rgba(46,125,120,.14); }
.btn--secondary { background: rgba(255,255,255,.76); }
.hero { padding-top: 20px; }
.hero__panel { padding: 56px 48px 48px; gap: 24px; min-height: 640px; border: 1px solid rgba(217,225,230,.65); background: radial-gradient(ellipse at 95% 28%,rgba(127,201,193,.25),transparent 53%),linear-gradient(115deg,#FFFFFF 28%,#F2F5F7 65%,#E8EEF2); }
.hero__panel::before { top: -90px; right: -70px; opacity: .8; }
.hero__panel::after { left: auto; right: -100px; bottom: -260px; opacity: .5; }
.hero h1 { font-size: clamp(42px,4.05vw,52px); line-height: 1.07; font-weight: 400; max-width: 530px; margin-bottom: 24px; }
.hero__sub { font-size: 16px; line-height: 1.7; max-width: 450px; margin-bottom: 26px; }
.hero__note { max-width: 420px; font-size: 12px; line-height: 1.65; padding-top: 18px; border-top: 1px solid var(--border); }
.hero__note strong { display: block; font-size: 13px; margin-bottom: 3px; }
.hero__actions { gap: 10px; }
.hero__actions .btn { padding: 0 20px; }
.chip { border: 1px solid rgba(217,225,230,.6); box-shadow: 0 12px 28px rgba(23,50,77,.08); }
.chip--2, .chip--3 { animation: none; }
.globe { filter: drop-shadow(0 18px 30px rgba(23,50,77,.035)); }
.marquee { border-bottom: 1px solid var(--border); }
.howto { gap: 64px; }
.stage { background: radial-gradient(ellipse at 80% 15%,rgba(127,201,193,.2),transparent 65%),linear-gradient(145deg,var(--page),var(--page-deep)); border: 1px solid var(--border); min-height: 510px; }
.acc__item { margin-bottom: 8px; }
.acc__item.is-open { background: linear-gradient(125deg,var(--navy),#244B68); box-shadow: 0 12px 28px rgba(23,50,77,.08); }
.acc__head { padding-top: 22px; padding-bottom: 22px; }
#people { background: var(--page); border-block: 1px solid rgba(217,225,230,.6); }
.collage__card { border: 1px solid rgba(217,225,230,.6); }
.section--tight { padding: 40px 0; }
.section--tight .panel-cta { display: grid; grid-template-columns: 1.3fr 1fr; gap: 16px 48px; text-align: left; padding: 40px 48px; background: linear-gradient(115deg,var(--page),var(--page-deep)); border: 1px solid var(--border); }
.section--tight .panel-cta h2 { font-size: 28px; grid-row: span 2; margin: 0; }
.section--tight .panel-cta p { font-size: 15px; margin: 0; }
.section--tight .panel-cta .btn { justify-self: start; }
#portal { padding-top: 72px; }
#portal .section-head { max-width: 790px; }
.dash-wrap { padding: 40px; background: radial-gradient(ellipse at 85% 0%,rgba(127,201,193,.3),transparent 55%),linear-gradient(135deg,#D9E1E6,#EEF3F6 55%,#D9E1E6); border: 1px solid var(--border); }
.dash { border: 1px solid rgba(255,255,255,.7); box-shadow: 0 24px 48px -20px rgba(23,50,77,.25); }
.dash__bar { flex-wrap: wrap; padding: 18px; background: white; }
.dash__tabs { order: 3; flex-basis: 100%; padding-top: 14px; border-top: 1px solid var(--border); gap: 8px; }
.dash__tab { min-height: 40px; padding: 8px 18px; }
.dash__body { background: var(--page); padding: 20px; }
.stat { border: 0; padding: 20px; }
.stat__value { font-size: 32px; }
.table td { padding-block: 14px; }
.feature { border: 1px solid var(--border); box-shadow: none; }
.feature__visual { background: linear-gradient(145deg,var(--navy),#2F6B8A); }
.feature__body { padding: 28px; }
.feature__body h3 { font-size: 22px; }
#operates { background: var(--page); }
.steps { gap: 0 36px; counter-reset: steps; }
.step { background: none; border-radius: 0; border-top: 1px solid var(--border); padding: 28px 0; grid-template-columns: 36px 1fr; }
.step__num { background: none; color: var(--blue); font-size: 24px; justify-content: start; width: 36px; height: 30px; }
.step h4 { font-size: 20px; margin-bottom: 12px; }
#quality { background: radial-gradient(ellipse at 100% 45%,rgba(127,201,193,.16),transparent 50%),#FAFBFC; }
#quality .split { align-items: start; gap: 56px; }
#quality .split__text { order: -1; }
#quality h2 { max-width: 500px; }
.qc-points { gap: 0; }
.qc-point { padding: 20px 0; border-top: 1px solid var(--border); }
.qc-point p { font-size: 14px; line-height: 1.65; }
.quality-col { background: linear-gradient(140deg,#E8EEF2,#EEF3F6); border: 1px solid var(--border); border-radius: 20px; padding: 22px; }
.quality-col > .reviewer { margin: 0; padding: 24px; border-radius: 12px 12px 0 0; box-shadow: none; gap: 16px; }
.reviewer__photo { width: 64px; height: 64px; }
.reviewer__name { font-size: 20px; }
.reviewer__line { font-size: 14px; }
.reviewer__owns { gap: 6px; padding-top: 14px; }
.reviewer__owns span { font-size: 11px; }
.quality-col > .checklist { margin: 0; box-shadow: none; border-radius: 0 0 12px 12px; border-top: 1px solid var(--border); }
.checklist__head { background: var(--navy); padding: 20px 24px; }
.checklist__head strong { color: white; }
.checklist__head span { color: var(--on-dark); }
.checklist .checkrow { padding: 12px 24px; font-size: 13px; gap: 10px; }
.checklist .checkrow::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--blue); flex-shrink: 0; }
.checklist__foot { font-size: 12px; line-height: 1.6; }
#value { border-top: 1px solid var(--border); }
.team-band img { mask-image: linear-gradient(#000 68%,transparent); -webkit-mask-image: linear-gradient(#000 68%,transparent); }
.cost-card { border: 1px solid var(--border); box-shadow: 0 18px 48px -28px rgba(23,50,77,.2); }
#pricing { background: var(--page); }
.pricing__grid { gap: 24px; grid-template-columns: 1.4fr 1fr; }
.price-card { border: 1px solid var(--border); }
.price-card--main { box-shadow: 0 20px 45px -25px rgba(23,50,77,.18); }
.price-card--main .price-card__head { background: radial-gradient(ellipse at 100% 0%,var(--teal-soft),transparent 70%),white; padding: 36px; }
.price__amount { font-size: 60px; font-weight: 400; }
.commitments { margin-top: 24px; background: linear-gradient(120deg,var(--navy),#244B68); }
.security__grid { gap: 0 40px; }
.sec-item { border-top: 1px solid var(--border); border-radius: 0; padding: 28px 0; background: none; }
.sec-item:hover { transform: none; box-shadow: none; }
.sec-item h4 { font-size: 20px; margin-top: 16px; }
.final .panel-cta { padding: 88px 64px; text-align: left; background: radial-gradient(ellipse at 100% 0%,rgba(47,107,138,.85),transparent 65%),linear-gradient(120deg,#10263B,#17324D); }
.final .panel-cta::after { content: ''; position: absolute; width: 420px; height: 420px; border: 1px solid rgba(255,255,255,.10); border-radius: 50%; right: -160px; bottom: -200px; box-shadow: 0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.02); pointer-events: none; }
.final .panel-cta h2 { max-width: 750px; margin-left: 0; font-size: clamp(32px,4vw,48px); font-weight: 400; }
.final .panel-cta p { margin: 20px 0 28px; color: var(--on-dark); }
.footer { background: #FAFBFC; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 100; background: white; color: var(--navy); padding: 12px 20px; border-radius: 8px; }
.skip-link:focus { top: 12px; }
@media (min-width: 769px) and (max-width: 1080px) {
 .hero__panel { grid-template-columns: 1fr 1fr; padding: 40px 28px; min-height: 620px; }
 .hero h1 { font-size: 42px; }
 .chip { padding: 8px; gap: 6px; }
 .chip strong { font-size: 11px; } .chip span { font-size: 10px; } .chip img { width: 28px; height: 28px; }
 .chip .chip__icon { width: 28px; height: 28px; } .chip .chip__icon svg { width: 14px; height: 14px; }
 .howto { gap: 36px; } .stage { min-height: 420px; }
 #quality .split { grid-template-columns: 1fr 1fr; gap: 28px; }
 .quality-col { padding: 12px; }
 .pricing__grid { grid-template-columns: 1.2fr 1fr; }
 .price-card__cols .inc ul { columns: 1; }
}
@media (max-width: 1100px) {
 .nav { display: none; }
 .nav-toggle { display: inline-flex; }
 .nav.is-open { display: flex; flex-direction: column; position: absolute; top: 80px; left: 0; right: 0; padding: 20px 24px; background: white; border-bottom: 1px solid var(--border); gap: 0; align-items: stretch; }
 .nav.is-open a { padding: 14px 0; }
}
@media (max-width: 768px) {
 .header__inner { height: 68px; gap: 10px; }
 .header__cta { gap: 8px; }
 .logo img { width: 116px; height: auto; }
 .header__cta .btn { font-size: 12px; padding: 0 12px; }
 .nav.is-open { top: 68px; }
 .hero { padding-top: 12px; }
 .hero__panel { display: flex; flex-direction: column; align-items: stretch; padding: 28px 20px; gap: 0; min-height: 0; }
 .hero__copy { display: contents; }
 .hero h1 { order: 0; font-size: 36px; line-height: 1.1; margin: 0 0 20px; }
 .hero .globe { order: 1; width: 100%; margin: 0 0 20px; }
 .hero__sub { order: 2; font-size: 15px; line-height: 1.65; margin-bottom: 22px; }
 .hero__actions { order: 3; margin-bottom: 20px; }
 .hero__note { order: 4; }
 .chip--1, .chip--5 { display: flex; padding: 6px 8px; gap: 6px; animation: none; }
 .chip--1 { top: 3%; left: -8px; } .chip--5 { top: 77%; left: -8px; }
 .chip strong { font-size: 10px; } .chip span { font-size: 9px; } .chip img { width: 26px; height: 26px; }
 .section-head { margin-bottom: 32px; }
 h2 { font-size: 32px; } .lede { font-size: 17px; }
 .split, .howto { gap: 36px; }
 .stage { min-height: 0; padding: 20px; }
 .avatars { grid-template-columns: repeat(2,1fr); }
 .section--tight .panel-cta { display: block; padding: 30px 24px; }
 .section--tight .panel-cta h2 { font-size: 26px; margin-bottom: 18px; }
 .section--tight .panel-cta p { margin-bottom: 22px; }
 .dash-wrap { padding: 8px; margin-inline: -4px; }
 .dash__bar { padding: 16px 12px; }
 .dash__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
 .dash__tab { font-size: 11px; padding: 8px 6px; border-radius: 8px; background: var(--page); }
 .dash__body { padding: 10px; }
 .stat { padding: 14px 10px; } .stat__label { font-size: 9px; } .stat__value { font-size: 28px; }
 .dash__grid, .dash__grid--even, .trend { grid-template-columns: minmax(0,1fr); }
 .panel { min-width: 0; } .table { min-width: 460px; }
 .feature__body { padding: 24px; }
 .feature__body h3 { min-height: 0; }
 .steps { gap: 0; }
 #quality .split { display: flex; flex-direction: column; gap: 28px; }
 #quality .split__text { order: -1; }
 .quality-col { width: 100%; padding: 12px; }
 .quality-col > .reviewer { margin: 0; padding: 20px; }
 .quality-col > .checklist { margin: 0; }
 .reviewer__head { gap: 14px; }
 .reviewer__photo { width: 56px; height: 56px; }
 .reviewer__tag { font-size: 9px; }
 .reviewer__role { font-size: 12px; }
 .team-band img { width: 100%; }
 .pricing__grid { grid-template-columns: 1fr; }
 .price-card--main .price-card__head { padding: 28px 22px; }
 .price__amount { font-size: 48px; }
 .price { flex-wrap: wrap; }
 .security__grid { gap: 0; }
 .final .panel-cta { padding: 44px 24px; }
 .final .panel-cta h2 { font-size: 32px; }
 .footer__grid { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
 .footer__brand { grid-column: 1/-1; }
}
@media (prefers-reduced-motion: reduce) {
 *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
 .btn:hover, .feature:hover { transform: none; }
}
.header-book-short { display: none; } @media(max-width:768px) { .header-book-full { display:none; } .header-book-short { display:inline; } }


/* Open onboarding composition: illustration and readable labels have separate space. */
#pricing .pricing__grid { grid-template-columns:1fr; }
#pricing .price-card--main { display:grid; grid-template-columns:1fr 1fr; }
#pricing .price-card--main .price-card__head { grid-row:span 2; border-bottom:0; border-right:1px solid var(--border); display:flex; flex-direction:column; justify-content:center; }
.onboarding-open { padding:64px 36px 48px; display:grid; grid-template-columns: .8fr 1.7fr; gap:24px 48px; align-items:center; }
.onboarding-open__intro h3 { font-size:36px; line-height:1.12; }
.onboarding-open__intro p { font-size:16px; color:var(--muted); max-width:270px; }
.onboarding-open__content { grid-column:2; grid-row:span 2; display:grid; grid-template-columns: minmax(220px,300px) 1fr; gap:32px; align-items:center; }
.onboarding-open>.btn { justify-self:start; align-self:start; }
.journey-wheel { position:relative; aspect-ratio:1; width:100%; }
.journey-wheel svg { width:100%; height:100%; }
.journey-wheel>img { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:48px; height:auto; }
.journey-wheel__node { position:absolute; display:grid; place-items:center; width:40px; height:40px; transform:translate(-50%,-50%); border-radius:50%; background:var(--page); border:1px solid var(--border); color:var(--blue); font-family:var(--font-display); font-size:14px; }
.journey-wheel__node--1 { left:50%; top:16.25%; } .journey-wheel__node--2 { left:83.75%; top:50%; } .journey-wheel__node--3 { left:50%; top:83.75%; } .journey-wheel__node--4 { left:16.25%; top:50%; background:var(--teal); color:white; border-color:var(--teal); }
.journey-copy { display:grid; gap:24px; }
.journey-copy li { display:grid; grid-template-columns:24px 1fr; gap:12px; }
.journey-copy li>span { font-size:12px; color:var(--blue); padding-top:3px; }
.journey-copy h4 { font-size:18px; margin-bottom:6px; }
.journey-copy p { font-size:13px; color:var(--muted); line-height:1.5; }
@media(max-width:1080px) { .onboarding-open { grid-template-columns:1fr; padding:48px 20px; gap:28px; } .onboarding-open__content { grid-column:auto; grid-row:auto; grid-template-columns:260px 1fr; } .onboarding-open__intro p { max-width:100%; } }
@media(max-width:768px) {
 #pricing .price-card--main { display:block; } #pricing .price-card--main .price-card__head { border-right:0; border-bottom:1px solid var(--border); }
 .onboarding-open { padding:44px 8px; } .onboarding-open__intro h3 { font-size:30px; }
 .onboarding-open__content { display:block; } .journey-wheel { display:none; }
 .journey-copy { gap:32px; } .journey-copy li { grid-template-columns:32px 1fr; position:relative; }
 .journey-copy li:not(:last-child)::after { content:'↓'; position:absolute; left:5px; top:34px; color:var(--blue); }
 .journey-copy h4 { font-size:19px; } .journey-copy p { font-size:14px; }
}

/* Clear separation between ongoing inclusions and commercial terms. */
#pricing .price-card--main .price-card__head { grid-row:1; }
#pricing .price-card--main .price-card__cols { border-top:0; }
.pricing-intro { font-size:15px; line-height:1.6; color:var(--charcoal); margin-bottom:18px; }
.pricing-client { font-size:13px; line-height:1.6; color:var(--muted); margin-top:18px; padding-top:16px; border-top:1px solid var(--border); }
.pricing-terms { grid-column:1/-1; border-top:1px solid var(--border); padding:28px 36px; }
.pricing-terms h4 { font-size:20px; margin-bottom:16px; }
.price-line small { display:block; color:var(--muted); font-size:12px; line-height:1.6; margin-top:5px; max-width:650px; }
.pricing-replacement { font-size:13px; color:var(--muted); padding-top:16px; line-height:1.6; }
@media(max-width:768px) { .pricing-terms { padding:24px 22px; } .pricing-terms .price-line { font-size:14px; } }


/* Client priorities: four scannable reasons to start a conversation. */
.needs-section { padding:48px 0; }
.needs-panel { padding:48px 36px; border-radius:20px; background:radial-gradient(ellipse at 100% 0%,rgba(47,107,138,.10),transparent 65%),linear-gradient(135deg,#EEF3F6,#F2F5F7); }
.needs-heading { text-align:center; max-width:720px; margin:0 auto 36px; }
.needs-heading h2 { font-size:36px; margin-bottom:14px; }
.needs-heading p { font-size:16px; color:var(--muted); }
.needs-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.needs-grid article { padding:28px 22px; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.8); }
.needs-icon { width:32px; height:32px; color:var(--blue); margin-bottom:24px; }
.needs-grid h3 { font-size:20px; line-height:1.2; margin-bottom:12px; }
.needs-grid p { font-size:14px; line-height:1.65; color:var(--muted); }
.needs-action { margin-top:32px; text-align:center; }
@media(max-width:1080px) { .needs-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .needs-section { padding:32px 0; } .needs-panel { padding:32px 20px; } .needs-heading { text-align:left; margin-bottom:24px; } .needs-heading h2 { font-size:28px; } .needs-grid { grid-template-columns:1fr; gap:12px; } .needs-grid article { padding:24px; } .needs-icon { margin-bottom:16px; } .needs-action .btn { width:100%; } }

/* Four-step service model, distinct from the later onboarding diagram. */
.how-workaid h2 { margin-bottom:30px; }
.how-workaid__steps { margin:0 0 30px; }
.how-workaid__steps li { position:relative; padding:0 0 26px 32px; }
.how-workaid__steps li:last-child { padding-bottom:0; }
.how-workaid__steps li::before { content:''; position:absolute; left:0; top:6px; width:11px; height:11px; border-radius:50%; background:var(--blue); box-shadow:0 0 0 4px #E8EEF2; }
.how-workaid__steps li:last-child::before { background:var(--teal); }
.how-workaid__steps li:not(:last-child)::after { content:''; position:absolute; left:5px; top:21px; bottom:0; width:1px; background:var(--border); }
.how-workaid__steps h3 { font-size:22px; line-height:1.25; margin-bottom:7px; }
.how-workaid__steps p { font-size:15px; line-height:1.6; color:var(--muted); }
@media(max-width:768px) { .how-workaid__steps h3 { font-size:20px; } .how-workaid__steps li { padding-left:28px; } }

/* A service equation, reflecting bundled pricing rather than salary pass-through. */
.pricing-explained { padding:64px 0 40px; }
.pricing-explained__head { text-align:center; max-width:740px; margin:0 auto 40px; }
.pricing-explained__head h2 { font-size:36px; } .pricing-explained__head h2 span { color:var(--blue); }
.pricing-explained__head p { color:var(--muted); font-size:16px; line-height:1.6; }
.pricing-equation { display:grid; grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr); gap:16px; }
.pricing-component__visual { background:white; border:1px solid var(--border); border-radius:12px; overflow:hidden; min-height:218px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.pricing-component__visual h3 { width:100%; padding:18px 12px; font-size:18px; background:var(--navy); color:white; margin:0; }
.pricing-component__visual>svg { width:46px; height:46px; color:var(--blue); margin:28px 0 18px; }
.pricing-component__visual>span { font-size:13px; color:var(--muted); padding:0 18px 24px; }
.pricing-component__price { font-family:var(--font-display); font-size:42px; font-weight:500; color:var(--navy); margin:26px 0 10px; }
.pricing-component ul { padding:20px 8px 0; display:grid; gap:12px; }
.pricing-component li { position:relative; padding-left:23px; font-size:14px; line-height:1.55; }
.pricing-component li::before { content:'✓'; position:absolute; left:0; color:var(--teal); }
.pricing-operator { padding-top:95px; font-size:28px; color:var(--navy); text-align:center; }
.pricing-explained__action { margin-top:32px; text-align:center; } .pricing-explained__action p { color:var(--muted); font-size:15px; margin-bottom:16px; }
@media(max-width:768px) { .pricing-explained { padding:44px 0 32px; } .pricing-explained__head h2 { font-size:28px; } .pricing-equation { grid-template-columns:1fr; gap:16px; } .pricing-operator { padding:0; } .pricing-component__visual { min-height:200px; } .pricing-component ul { padding-top:16px; } }

/* Branded pricing illustrations: one consistent stroke and restrained status accent. */
.pricing-component__visual { min-height:270px; }
.pricing-component__visual>.pricing-brand-icon { width:72px; height:72px; flex-shrink:0; margin:24px 0 16px; }
.pricing-component__visual>.pricing-brand-icon--fee { width:56px; height:56px; margin:16px 0 4px; }
.pricing-component__visual .pricing-component__price { font-size:36px; margin:0 0 8px; }

.pricing-support-logo { min-height:112px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:14px; padding:20px; }
.pricing-support-logo img { width:158px; height:auto; }
.pricing-support-logo span { font-size:11px; letter-spacing:.04em; color:var(--navy); }
.pricing-component__visual>.pricing-brand-icon { width:76px; height:76px; margin:24px 0 16px; }
.pricing-component__visual>.pricing-brand-icon--fee { width:60px; height:60px; margin:16px 0 4px; }

/* Final pricing equation: consistent visual slots, aligned checks and clear reading order. */
.pricing-explained { max-width:1100px; margin:56px auto 0; padding:56px 24px 40px; border-top:1px solid var(--border); }
.pricing-explained__head { max-width:660px; margin-bottom:44px; }
.pricing-explained__head h2 { font-size:40px; line-height:1.12; letter-spacing:-.025em; margin-bottom:18px; }
.pricing-explained__head .eyebrow { margin-bottom:14px; }
.pricing-explained__head p { font-size:16px; }
.pricing-equation { grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr) 32px minmax(0,1fr); gap:20px; align-items:start; }
.pricing-component__visual { min-height:0; height:236px; display:grid; grid-template-rows:56px 132px 48px; justify-items:center; border-radius:12px; background:var(--white); box-shadow:0 5px 16px rgba(23,50,77,.035); }
.pricing-component__visual h3 { height:56px; display:flex; align-items:center; justify-content:center; font-size:17px; line-height:1.2; padding:12px; }
.pricing-component__visual>.pricing-brand-icon,.pricing-component__visual>.pricing-brand-icon--fee { width:76px; height:76px; margin:0; align-self:center; }
.pricing-support-logo { padding:0 16px; min-height:0; height:132px; width:100%; }
.pricing-support-logo img { width:160px; max-width:90%; height:auto; }
.pricing-component__visual>span { font-size:12px; padding:0 12px; align-self:start; color:var(--muted); }
.pricing-operator { padding:0; height:236px; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:400; font-size:30px; }
.pricing-component ul { padding:24px 4px 0; gap:0; }
.pricing-component li { font-size:14px; line-height:1.5; padding:9px 0 9px 24px; min-height:40px; }
.pricing-component li::before { font-size:17px; top:7px; font-weight:600; }
.pricing-explained__action { margin-top:36px; }
.pricing-explained__action p { margin-bottom:18px; }
@media(min-width:769px) and (max-width:1080px) { .pricing-explained { padding-inline:0; } .pricing-equation { gap:12px; grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr); } .pricing-component__visual h3 { font-size:15px; } }
@media(max-width:768px) {
 .pricing-explained { margin-top:32px; padding:36px 0 24px; }
 .pricing-explained__head { text-align:left; margin-bottom:28px; }
 .pricing-explained__head h2 { font-size:30px; }
 .pricing-equation { grid-template-columns:minmax(0,1fr); gap:16px; max-width:420px; margin:auto; }
 .pricing-component__visual { height:208px; grid-template-rows:52px 112px 44px; }
 .pricing-component__visual h3 { height:52px; }
 .pricing-support-logo { height:112px; }
 .pricing-component ul { padding-top:12px; }
 .pricing-operator { height:32px; font-size:26px; }
 .pricing-explained__action .btn { width:100%; max-width:420px; }
}
#pricing-explained-title { scroll-margin-top:110px; }