/* Structure M1 (2026-10-21): CTA band, sticky contact bar (phones), phone/WhatsApp placeholders, compact home plans.
   Loaded on every page after rs-effects/rs-header/rs-consent (functions.php). Header button + phone live in rs-header.css. */
:root { --rs-bar-h: 0px; }

/* template parts sit flush: no block-gap strip between content, CTA band and footer */
.wp-site-blocks > .site-cta, .wp-site-blocks > footer.wp-block-template-part, .wp-site-blocks > .site-contact-bar { margin-block-start: 0; }

/* phone / WhatsApp: plain text while they are placeholders, links once the numbers are set (functions.php) */
.rs-tel, .rs-wa { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.rs-tel:hover, .rs-wa:hover { text-decoration-color: var(--rs-mint); text-decoration-thickness: 2px; }

/* CTA band (parts/cta-band.html), on top of the mint .rs-cta panel */
.rs-cta-band { padding-block: clamp(3rem, 6vw, 5rem); }
.rs-cta-band .rs-cta-title { max-width: 22ch; margin: 0; font-size: clamp(1.875rem, 1.2rem + 2.6vw, 3.25rem); font-weight: 600; letter-spacing: -.03em; line-height: 1.1; color: var(--rs-ink); text-wrap: balance; }
.rs-cta-band .rs-cta-in > p { margin-top: 1rem !important; }
.rs-cta-band .rs-cta-row { margin-top: clamp(1.5rem, 3vw, 2rem) !important; gap: 1rem 2rem !important; }
.rs-cta-band .rs-cta-row .wp-block-buttons { width: auto; }
.rs-cta-band .rs-cta-contact { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; max-width: none; margin: 0 !important; font-weight: 600; color: var(--rs-ink); }
.rs-cta-band a:focus-visible { outline: 2px solid var(--rs-ink); outline-offset: 3px; }
@media (max-width: 781px) { .rs-cta-band .rs-cta-row .wp-block-buttons { width: auto; } }

/* footer contact column */
.rs-footer-contact p { margin: 0 0 .5rem; }

/* Cere o oferta: phone / WhatsApp next to the form */
.rs-offer-contact { margin: 0 !important; font-weight: 600; line-height: 1.7; color: var(--rs-head); }

/* home: four compact plan cards (Start, Prezentare, Magazin online, Mentenanta): 1 column, 2x2 from 782px, 4 across from 1200px */
.rs-plans.rs-plans-4 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 782px) { .rs-plans.rs-plans-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) {
	.rs-plans.rs-plans-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px !important; }
	.rs-plans-4 .rs-plan { padding: 1.5rem 1.25rem; }
	.rs-plans-4 .rs-plan h3 { font-size: 1.25rem; }
	.rs-plans-4 .rs-plan-price strong { font-size: clamp(1.375rem, .3rem + 1.35vw, 1.75rem); white-space: nowrap; }
}
.rs-plan-price .rs-plan-per { font-size: .5em; font-weight: 600; letter-spacing: 0; color: var(--rs-body); }
.rs-plans-compact .rs-plan .rs-plan-more { padding-top: 1.25rem; }
.rs-plans-compact .rs-plan .rs-plan-for { padding-bottom: 0; border-bottom: 0; }

/* sticky contact bar: phones only (parts/contact-bar.html) */
.rs-bar { display: none; }
@media (max-width: 781px) {
	/* --rs-bar-h stays 0px (no body padding, nothing lifted) when the launch switch removed the bar */
	:root:has(.rs-bar) { --rs-bar-h: calc(64px + env(safe-area-inset-bottom, 0px)); }
	body { padding-bottom: var(--rs-bar-h); }
	html { scroll-padding-bottom: calc(var(--rs-bar-h) + 12px); }
	.rs-bar { display: block; position: fixed; z-index: 90; left: 0; right: 0; bottom: 0; padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px)); background: var(--rs-ink); border-top: 1px solid rgba(255, 255, 255, .18); }
	.rs-bar-in { display: flex; gap: 8px; padding-left: 56px; }
	.rs-bar-btn { flex: 1 1 0; display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 48px; padding: .5rem; background: #fff; color: var(--rs-ink); border: 1px solid #fff; font-size: 1rem; font-weight: 600; line-height: 1.2; text-align: center; text-decoration: none; transition: background-color .2s, border-color .2s; }
	a.rs-bar-btn:hover, a.rs-bar-btn:focus-visible { background: var(--rs-mint); border-color: var(--rs-mint); color: var(--rs-ink); }
	a.rs-bar-btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 5px rgba(85, 230, 165, .6); }
	/* the menu overlay is open: the bar would sit on top of its last items */
	body:has(.rs-nav.is-open) .rs-bar { display: none; }
	/* cookie banner and its reopen button sit above the bar, not behind it */
	body:has(.rs-bar) .rs-consent { bottom: calc(var(--rs-bar-h) + 16px); }
	/* D7: the reopen button lives inside the bar (44px, vertically centred), so it never covers page text */
	body:has(.rs-bar) .rs-consent-fab { left: 8px; bottom: calc(env(safe-area-inset-bottom, 0px) + 10px); width: 44px; height: 44px; }
	body:has(.rs-bar) .rs-consent { max-height: calc(100vh - var(--rs-bar-h) - 32px); max-height: calc(100dvh - var(--rs-bar-h) - 32px); }
}
@media (prefers-reduced-motion: reduce) { .rs-bar-btn { transition: none; } }
@media print { .rs-bar { display: none !important; } }

/* ---------- Structure M2 (2026-10-21): /preturi/, /site-ieftin/, /realizare-site-bucuresti/, /portofoliu/, home teaser ---------- */
.rs-sec-tint { background: var(--rs-tint); }
.rs-cardsec h2 + .rs-intro { margin-top: 1rem !important; }
.rs-more.rs-plans-all { margin-top: 1.25rem !important; text-align: center; }

/* price table (/preturi/): hairline rows, price in the second column, stacked on phones */
.wp-block-post-content .rs-ptable { margin: clamp(1.75rem, 3.5vw, 2.75rem) 0 0 !important; }
.wp-block-post-content .rs-ptable table { width: 100%; border-collapse: collapse; border: 0; font-size: 1rem; }
.wp-block-post-content .rs-ptable :is(th, td) { padding: 1.25rem 1.25rem 1.25rem 0; border: 0; text-align: left; vertical-align: baseline; }
.wp-block-post-content .rs-ptable th { padding-block: .75rem; border-bottom: 2px solid var(--rs-ink); font-size: .875rem; font-weight: 600; color: var(--rs-body); }
.wp-block-post-content .rs-ptable td { border-bottom: 1px solid var(--rs-line); color: var(--rs-head); transition: border-color .3s ease; }
.wp-block-post-content .rs-ptable tr:hover td { border-bottom-color: var(--rs-mint); }
.wp-block-post-content .rs-ptable td:first-child { width: 30%; font-size: 1.125rem; font-weight: 600; }
.wp-block-post-content .rs-ptable td:nth-child(2) { width: 26%; font-size: clamp(1.375rem, 1.1rem + 1vw, 1.875rem); font-weight: 700; letter-spacing: -.02em; line-height: 1.1; color: var(--rs-ink); white-space: nowrap; }
@media (max-width: 639px) {
	.wp-block-post-content .rs-ptable :is(table, thead, tbody, tr, th, td) { display: block; width: auto; }
	.wp-block-post-content .rs-ptable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.wp-block-post-content .rs-ptable tr { padding-block: 1.25rem; border-bottom: 1px solid var(--rs-line); }
	.wp-block-post-content .rs-ptable td { padding: 0; border: 0; }
	.wp-block-post-content .rs-ptable td:first-child, .wp-block-post-content .rs-ptable td:nth-child(2) { width: auto; }
	.wp-block-post-content .rs-ptable td:nth-child(2) { margin-block: .35rem; }
}
.rs-pr-inc .rs-tiers { margin-top: clamp(2rem, 4vw, 3rem) !important; }
.rs-tier .rs-more { margin-top: auto !important; padding-top: 1.25rem; }

/* "what is not included" list: hairline rows with a bold lead-in, no ticks */
.wp-block-post-content .rs-nolist { list-style: none; margin: 0; padding: 0; }
.rs-nolist li { padding-block: 1.1rem; border-bottom: 1px solid var(--rs-line); font-size: 1rem; line-height: 1.55; color: var(--rs-body); transition: border-color .3s ease; }
.rs-nolist li:first-child { border-top: 1px solid var(--rs-line); }
.rs-nolist li:hover { border-bottom-color: var(--rs-mint); }
.rs-nolist strong { color: var(--rs-head); }
.rs-st-not .rs-nolist { margin-top: 1.5rem; }

/* /site-ieftin/: dark offer card beside the inclusion list */
.rs-offer-cols, .rs-st-cols { gap: clamp(2rem, 5vw, 5rem) !important; align-items: stretch; }
.rs-offer-card { height: 100%; padding: clamp(1.75rem, 3.5vw, 3rem); background: var(--rs-ink); color: #fff; }
.rs-offer-card > * { margin: 0 !important; }
.rs-offer-card > * + * { margin-top: 1.25rem !important; }
.wp-block-post-content .rs-offer-card h2 { font-size: clamp(1.25rem, 1.1rem + .6vw, 1.5rem); color: #fff; }
.wp-block-post-content .rs-offer-card p { color: #d5dade; }
.wp-block-post-content .rs-offer-card .rs-offer-price { font-size: clamp(2.5rem, 1.5rem + 4vw, 4.25rem); font-weight: 700; letter-spacing: -.04em; line-height: 1; color: var(--rs-mint); overflow-wrap: anywhere; }
.rs-offer-card .rs-offer-btn { margin-top: clamp(1.5rem, 3vw, 2.25rem) !important; }
.rs-offer-card .wp-block-button.is-style-fill .wp-block-button__link { background: var(--rs-mint); color: var(--rs-ink); }
.rs-offer-card .wp-block-button.is-style-fill .wp-block-button__link:hover { background: #fff; color: var(--rs-ink); }
.rs-offer-card a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.rs-st-offer .rs-offer-list { grid-template-columns: minmax(0, 1fr); margin-top: 1.5rem !important; }
.rs-st-lead { margin-top: 0 !important; margin-bottom: 1.5rem !important; }
.rs-st-who .rs-despre-list { margin-top: 0; }
.rs-st-not .rs-more { margin-top: 1.5rem !important; }

/* /realizare-site-bucuresti/: three-line package summary */
.wp-block-post-content .rs-sumlist { list-style: none; margin: clamp(1.5rem, 3vw, 2.5rem) 0 0; padding: 0; }
.rs-sumlist li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .35rem 2rem; align-items: baseline; padding-block: 1.35rem; border-bottom: 1px solid var(--rs-line); }
.rs-sumlist li:first-child { border-top: 1px solid var(--rs-line); }
.rs-sumlist .rs-sum-p { grid-column: 2; grid-row: 1; font-size: 1.375rem; font-weight: 700; letter-spacing: -.02em; color: var(--rs-ink); white-space: nowrap; }
.rs-sumlist strong { font-size: 1.125rem; color: var(--rs-head); }
.rs-sumlist .rs-sum-d { grid-column: 1 / -1; color: var(--rs-body); }
@media (max-width: 479px) { .rs-sumlist .rs-sum-p { grid-column: 1; grid-row: auto; } }

/* project cards (/portofoliu/ grid, home teaser): frame, name, type, what we did */
.rs-pgrid { display: grid !important; grid-template-columns: minmax(0, 1fr); gap: 30px !important; margin-top: clamp(2rem, 4vw, 3.5rem) !important; }
@media (min-width: 640px) { .rs-pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.rs-pcard { display: flex !important; flex-direction: column; gap: .75rem !important; padding-bottom: clamp(1.25rem, 2.4vw, 1.75rem); background: #fff; border: 1px solid var(--rs-line); border-bottom: 3px solid var(--rs-line); transition: border-color .3s ease, box-shadow .3s ease; }
.rs-pcard > * { margin: 0 !important; }
.rs-pcard > :not(.rs-ph) { padding-inline: clamp(1.25rem, 2.4vw, 1.75rem); }
.rs-pcard .rs-ph { aspect-ratio: 16 / 10; min-height: 0; border: 0; border-bottom: 1px solid var(--rs-line); margin-bottom: .5rem !important; }
.rs-pcard h3 { overflow-wrap: anywhere; }
.rs-pcard > .rs-pcard-img { padding-inline: 0; aspect-ratio: 16 / 10; overflow: hidden; border-bottom: 1px solid var(--rs-line); margin-bottom: .5rem !important; background: #eeeef1; }
.rs-pcard-img a { display: block; height: 100%; }
.rs-pcard-img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .6s ease; }
.rs-pcard:hover .rs-pcard-img img, .rs-pcard:focus-within .rs-pcard-img img { transform: scale(1.03); }
@media (prefers-reduced-motion: reduce) { .rs-pcard-img img { transition: none; } .rs-pcard:hover .rs-pcard-img img, .rs-pcard:focus-within .rs-pcard-img img { transform: none; } }
.rs-pcard .rs-pcard-link { margin-top: auto !important; padding-top: .5rem; font-size: .9375rem; }
.rs-pcard .rs-pcard-res + .rs-pcard-link { margin-top: .25rem !important; }
.rs-pcard .rs-pcard-type { font-size: .9375rem; font-weight: 600; color: var(--rs-green); }
.rs-pcard .rs-pcard-res { margin-top: auto !important; padding-top: 1rem; font-size: .875rem; color: var(--rs-body); }
.rs-pcard:hover, .rs-pcard:focus-within { border-bottom-color: var(--rs-mint); box-shadow: 0 0 40px rgba(85, 230, 165, .2); }
.rs-pf-grid .rs-pgrid { margin-top: 0 !important; }
.rs-portfolio .rs-head-row { align-items: flex-end; }

/* Despre noi: the Ce facem list links to the six service pages */
.rs-despre-list a { display: block; color: inherit; text-decoration: none; }
.rs-despre-list a:hover { text-decoration: underline; text-decoration-color: var(--rs-mint); text-decoration-thickness: 2px; text-underline-offset: 5px; }
@media (prefers-reduced-motion: reduce) { .rs-ptable td, .rs-nolist li, .rs-pcard { transition: none; } }

/* WCAG 2.5.8: hit areas of at least 24px for footer links, plan-card links and the mailto link */
footer.wp-block-template-part .rs-footer-links a, .rs-footer-contact a { display: inline-block; min-height: 24px; padding-block: 3px; line-height: 1.5; }
.rs-plan .rs-plan-more a, .rs-pill a[href^="mailto:"], .rs-offer-contact a { display: inline-block; min-height: 24px; padding-block: 2px; }

/* Structure M3 (2026-10-21): breadcrumb, Ghiduri list (templates/home.html) and article (templates/single.html) */
.rs-crumbs { background: var(--rs-ink); padding: .875rem var(--rs-gutter) 0; }
.rs-crumbs-in { display: flex; flex-wrap: wrap; gap: 0 .25rem; max-width: var(--wp--style--global--wide-size, 1240px); margin: 0 auto; padding: 0; list-style: none; font-size: .8125rem; line-height: 1.4; color: #b4bcc2; }
.rs-crumbs-in li { display: inline-flex; align-items: center; margin: 0; }
.rs-crumbs-in li + li::before { content: "/"; margin-right: .25rem; color: #6f7a82; }
.rs-crumbs-in a { display: inline-flex; align-items: center; min-height: 24px; color: #b4bcc2; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; }
.rs-crumbs-in a:hover { color: #fff; text-decoration-color: var(--rs-mint); }
.rs-crumbs-in a:focus-visible { outline: 2px solid var(--rs-mint); outline-offset: 2px; }
.rs-crumbs-in [aria-current] { color: #fff; }

/* Ghiduri redesign (2026-10-22): same look as /portofoliu/ and /despre-noi/ (dark stage with mint glow, outline numerals, hairline rows turning mint, pills with arrow). Scoped: .rs-gd-* (list + hero), .rs-art-* / .rs-post-* (article) */
.rs-gd-head { position: relative; overflow: hidden; isolation: isolate; padding-inline: var(--rs-gutter); padding-block: clamp(3rem, 6vw, 5.5rem) clamp(2rem, 4vw, 3.5rem); background: radial-gradient(70% 90% at 92% 0%, rgba(85, 230, 165, .28), transparent 62%), var(--rs-ink); }
.rs-gd-head .rs-gd-title { max-width: 20ch; margin: 0; font-size: clamp(2.5rem, 1.4rem + 4.6vw, 5rem); font-weight: 700; letter-spacing: -.04em; line-height: 1.02; color: #fff; text-wrap: balance; }
.rs-gd-head .rs-gd-title.rs-art-title { max-width: 24ch; font-size: clamp(2.25rem, 1.3rem + 3.8vw, 4rem); line-height: 1.06; }
.rs-gd-head .rs-gd-lead { max-width: 56ch; margin: clamp(1.25rem, 2.5vw, 2rem) 0 0; font-size: clamp(1.0625rem, 1rem + .35vw, 1.25rem); line-height: 1.6; color: #d5dade; }
.rs-post-meta { display: flex; flex-wrap: wrap; margin: clamp(1.25rem, 2.5vw, 2rem) 0 0; font-size: 1rem; line-height: 1.5; color: #d5dade; }
.rs-post-meta span + span::before { content: "\00b7"; content: "\00b7" / ""; margin-inline: .75rem; color: var(--rs-mint); }
@media (max-width: 600px) { .rs-post-meta { gap: .25rem 1.25rem; } .rs-post-meta span + span::before { display: none; } }

.rs-gd-list { padding-inline: var(--rs-gutter); padding-block: 0 var(--rs-sec); background: radial-gradient(55% 45% at 4% 100%, rgba(85, 230, 165, .16), transparent 65%), var(--rs-ink); }
.rs-gd-items { counter-reset: rs-gd; margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255, 255, 255, .18); }
.rs-gd-items > li { counter-increment: rs-gd; margin: 0; }
.rs-gd-item { position: relative; display: grid !important; grid-template-columns: 3rem minmax(0, 1fr); column-gap: 1rem; row-gap: .5rem; align-items: start; margin: 0; padding-block: clamp(1.75rem, 3.2vw, 2.75rem); border-bottom: 1px solid rgba(255, 255, 255, .18); transition: border-color .3s ease; }
.rs-gd-item > * { grid-column: 2; margin: 0 !important; }
.rs-gd-item::before { content: counter(rs-gd, decimal-leading-zero); content: counter(rs-gd, decimal-leading-zero) / ""; grid-column: 1; grid-row: 1 / span 4; font-family: "Inter Outline", Inter, system-ui, sans-serif; font-size: 1.5rem; font-weight: 300; line-height: 1.3; color: transparent; -webkit-text-stroke: 1px #fff; }
.rs-gd-item:hover, .rs-gd-item:focus-within { border-bottom-color: var(--rs-mint); }
.rs-gd-meta { display: flex; flex-wrap: wrap; gap: .25rem 1rem; font-size: .9375rem; line-height: 1.5; color: #b4bcc2; }
.rs-gd-meta > * { margin: 0 !important; }
.rs-gd-meta .rs-gd-date { color: inherit; }
.rs-gd-item .rs-gd-item-title { margin: .25rem 0 0 !important; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.5rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.12; color: #fff; text-wrap: balance; transition: color .25s ease; }
.rs-gd-item .rs-gd-item-title a { color: inherit; text-decoration: none; }
.rs-gd-item .rs-gd-item-title a::after { content: ""; position: absolute; inset: 0; }
.rs-gd-item .rs-gd-item-title a:focus-visible { outline: none; }
.rs-gd-item .rs-gd-item-title a:focus-visible::after { outline: 3px solid var(--rs-mint); outline-offset: -3px; }
.rs-gd-item:hover .rs-gd-item-title, .rs-gd-item:focus-within .rs-gd-item-title { color: var(--rs-mint); }
.rs-gd-item .rs-gd-excerpt { max-width: 60ch; font-size: clamp(1.0625rem, 1rem + .25vw, 1.1875rem); line-height: 1.6; color: #d5dade; }
.rs-gd-item .rs-gd-excerpt p { margin: 0; }
.rs-gd-go { display: inline-flex; align-items: center; gap: .5rem; justify-self: start; min-height: 44px; margin-top: .75rem !important; padding: .5rem 1.15rem; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; font-size: 1.0625rem; font-weight: 600; color: #fff; transition: background-color .25s ease, border-color .25s ease, color .25s ease; }
.rs-gd-go::after { content: ""; width: .8em; height: .8em; background: currentColor; -webkit-mask: var(--rs-arrow) center / contain no-repeat; mask: var(--rs-arrow) center / contain no-repeat; transition: transform .25s ease; }
.rs-gd-item:hover .rs-gd-go, .rs-gd-item:focus-within .rs-gd-go { background: var(--rs-mint); border-color: var(--rs-mint); color: var(--rs-ink); }
.rs-gd-item:hover .rs-gd-go::after { transform: translate(2px, -2px); }
.rs-gd-pager { margin-top: clamp(1.5rem, 3vw, 2.5rem); font-weight: 600; }
.rs-gd-pager a { display: inline-flex; align-items: center; min-height: 44px; padding: .5rem 1.15rem; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; color: #fff; text-decoration: none; transition: background-color .25s ease, border-color .25s ease, color .25s ease; }
.rs-gd-pager a:hover { background: var(--rs-mint); border-color: var(--rs-mint); color: var(--rs-ink); }
.rs-gd-pager a:focus-visible { outline: 3px solid var(--rs-mint); outline-offset: 3px; }
.rs-gd-empty { margin: 0 !important; padding-block: clamp(1.75rem, 3.2vw, 2.75rem) 1rem; border-top: 1px solid rgba(255, 255, 255, .18); font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.5rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.12; color: #fff; }
.rs-gd-empty-link { margin: 0 !important; padding-bottom: clamp(1.75rem, 3.2vw, 2.75rem); border-bottom: 1px solid rgba(255, 255, 255, .18); font-size: 1.0625rem; }
.rs-gd-empty-link a { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: .5rem 1.15rem; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; font-weight: 600; color: #fff; text-decoration: none; transition: background-color .25s ease, border-color .25s ease, color .25s ease; }
.rs-gd-empty-link a::after { content: ""; width: .8em; height: .8em; background: currentColor; -webkit-mask: var(--rs-arrow) center / contain no-repeat; mask: var(--rs-arrow) center / contain no-repeat; }
.rs-gd-empty-link a:hover { background: var(--rs-mint); border-color: var(--rs-mint); color: var(--rs-ink); }
.rs-gd-empty-link a:focus-visible { outline: 3px solid var(--rs-mint); outline-offset: 3px; }
@media (min-width: 782px) {
	.rs-gd-item { grid-template-columns: clamp(4rem, 7vw, 6rem) minmax(0, 1fr) auto; column-gap: clamp(1rem, 3vw, 2.5rem); }
	.rs-gd-item::before { font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1.1; -webkit-text-stroke-width: 1.3px; }
	.rs-gd-go { grid-column: 3; grid-row: 1 / span 4; align-self: center; margin-top: 0 !important; }
}

/* Article */
.rs-post-body { padding: clamp(3rem, 6vw, 5.5rem) var(--rs-gutter); background: #fff; }
.rs-post-body .wp-block-post-content { max-width: 66ch; margin-inline: auto; font-size: clamp(1.125rem, 1.06rem + .3vw, 1.25rem); line-height: 1.7; color: var(--rs-head); overflow-wrap: break-word; }
.rs-post-body .wp-block-post-content > * { max-width: none; margin-block: 0; }
.rs-post-body .wp-block-post-content > * + * { margin-top: 1.4em; }
.rs-post-body .wp-block-post-content :is(h2, h3) { color: var(--rs-head); text-wrap: balance; }
.rs-post-body .wp-block-post-content h2 { margin-top: 2.75em; font-size: clamp(1.625rem, 1.3rem + 1.3vw, 2.25rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.15; }
.rs-post-body .wp-block-post-content h3 { margin-top: 2.25em; font-size: clamp(1.3125rem, 1.15rem + .6vw, 1.625rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.25; }
.rs-post-body .wp-block-post-content :is(h2, h3) + * { margin-top: .9em; }
.rs-post-body .wp-block-post-content strong { font-weight: 700; }
.rs-post-body .wp-block-post-content a { color: var(--rs-green); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.rs-post-body .wp-block-post-content a:hover { text-decoration-color: var(--rs-mint); text-decoration-thickness: 3px; }
.rs-post-body .wp-block-post-content a:focus-visible { outline: 3px solid var(--rs-green); outline-offset: 2px; border-radius: 2px; }
.rs-post-body .wp-block-post-content :is(ul, ol) { padding-left: 1.4em; }
.rs-post-body .wp-block-post-content li { margin: 0; padding-left: .3em; }
.rs-post-body .wp-block-post-content li + li { margin-top: .55em; }
.rs-post-body .wp-block-post-content li::marker { color: var(--rs-green); font-weight: 700; }
.rs-post-body .wp-block-post-content :is(ul, ol) :is(ul, ol) { margin-top: .55em; }
.rs-post-body .wp-block-post-content blockquote { margin-inline: 0; padding: .25em 0 .25em 1.5rem; border-left: 3px solid var(--rs-mint); font-size: 1.12em; font-weight: 500; line-height: 1.55; }
.rs-post-body .wp-block-post-content blockquote p { margin: 0; }
.rs-post-body .wp-block-post-content blockquote p + p { margin-top: .8em; }
.rs-post-body .wp-block-post-content blockquote cite { display: block; margin-top: .75em; font-size: .85em; font-style: normal; color: var(--rs-body); }
.rs-post-body .wp-block-post-content .wp-block-table { overflow-x: auto; }
.rs-post-body .wp-block-post-content table { width: 100%; border-collapse: collapse; font-size: .9375em; line-height: 1.45; }
.rs-post-body .wp-block-post-content :is(th, td) { padding: .75rem 1rem; border: 0; border-bottom: 1px solid var(--rs-line); text-align: left; vertical-align: top; }
.rs-post-body .wp-block-post-content th { background: var(--rs-tint); font-weight: 600; border-bottom-color: var(--rs-head); }
.rs-post-body .wp-block-post-content :is(img, figure) { max-width: 100%; height: auto; }
.rs-post-body .wp-block-post-content figcaption { margin-top: .5rem; font-size: .875rem; color: var(--rs-body); }
.rs-post-body .wp-block-post-content :where(code) { padding: .1em .35em; background: var(--rs-tint); border-radius: 3px; font-size: .9em; }
.rs-post-body .wp-block-post-content hr { margin-block: 3rem; border: 0; border-top: 1px solid var(--rs-line); }

.rs-post-sec { padding: clamp(2.5rem, 5vw, 4.5rem) var(--rs-gutter); background: var(--rs-tint); }
.rs-post-sec + .rs-post-sec { padding-top: 0; }
.rs-post-sec + .rs-post-sec .rs-post-sec-in { padding-top: clamp(2.5rem, 5vw, 4.5rem); border-top: 1px solid rgba(2, 5, 10, .2); }
.rs-post-sec-in { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; max-width: var(--wp--style--global--wide-size, 1290px); margin-inline: auto; align-items: start; }
.rs-post-sec-head > * { margin: 0; }
.rs-post-sec h2 { font-size: clamp(1.75rem, 1.2rem + 1.8vw, 2.75rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.08; color: var(--rs-head); }
.rs-post-sec p { margin-top: 1rem; max-width: 36ch; font-size: 1.0625rem; line-height: 1.6; color: var(--rs-body); }
.rs-post-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(2, 5, 10, .2); }
.rs-post-list li { margin: 0; border-bottom: 1px solid rgba(2, 5, 10, .2); transition: border-color .3s ease, box-shadow .3s ease; }
.rs-post-list li:hover, .rs-post-list li:focus-within { border-bottom-color: var(--rs-mint); box-shadow: 0 1px 0 var(--rs-mint); }
.rs-post-list time { display: block; padding-top: 1.25rem; font-size: .9375rem; color: var(--rs-body); }
.rs-post-list a { display: grid; grid-template-columns: minmax(0, 1fr) 1.1rem; align-items: center; gap: 1rem; min-height: 44px; padding-block: 1.35rem; font-size: clamp(1.1875rem, 1rem + .8vw, 1.625rem); font-weight: 600; letter-spacing: -.015em; line-height: 1.3; color: var(--rs-head); text-decoration: none; }
.rs-post-list time + a { padding-top: .35rem; }
.rs-post-list a::after { content: ""; width: 1.1rem; height: 1.1rem; background: var(--rs-green); -webkit-mask: var(--rs-arrow) center / contain no-repeat; mask: var(--rs-arrow) center / contain no-repeat; transition: transform .25s ease; }
.rs-post-list a:hover { text-decoration: underline; text-decoration-color: var(--rs-mint); text-decoration-thickness: 2px; text-underline-offset: 6px; }
.rs-post-list a:hover::after { transform: translate(2px, -2px); }
.rs-post-list a:focus-visible { outline: 3px solid var(--rs-ink); outline-offset: -3px; }
@media (min-width: 782px) { .rs-post-sec-in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2.5rem, 5vw, 5rem); } }
@media (prefers-reduced-motion: reduce) { .rs-gd-item, .rs-gd-item-title, .rs-gd-go, .rs-gd-go::after, .rs-gd-pager a, .rs-gd-empty-link a, .rs-post-list li, .rs-post-list a::after { transition: none; } .rs-gd-item:hover .rs-gd-go::after, .rs-post-list a:hover::after { transform: none; } }

/* M3 fixes from the M2 QA (D1-D4) */
/* D1: the Start price stays on one line; the size follows the card width (container query), 24px minimum */
.rs-offer-card { container-type: inline-size; }
.wp-block-post-content .rs-offer-card .rs-offer-price { white-space: nowrap; font-size: clamp(1.5rem, 11cqw, 3.5rem); }
/* D2: "Pentru cine este" = three equal aligned columns, one column on phones */
.wp-block-post-content .rs-st-lead + .rs-despre-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 781px) { .wp-block-post-content .rs-st-lead + .rs-despre-list { grid-template-columns: minmax(0, 1fr); } }
/* D3: grid items carry no flow-layout block-gap margin (it pushed cards 2 and 3 down) */
.rs-pgrid > * { margin: 0 !important; }
/* D4: list links fill the row, so the hit area is the whole row (>= 24px) */
.rs-despre-list li:has(> a) { padding-block: 0; }
.rs-despre-list a { padding-block: 1.25rem; }

/* WhatsApp floating button (parts/wa-fab.html): bottom-right twin of .rs-consent-fab (rs-consent.css), same size, outline and focus ring. Phones have WhatsApp in the contact bar, so desktop and tablet only. Below the cookie banner (1000) and button (999). */
.rs-wa-fab { display: none; }
@media (min-width: 782px) {
	.rs-wa-fab { position: fixed; z-index: 998; right: 24px; bottom: 24px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; color: #02050a; background: #fff; border: 1px solid #02050a; border-radius: 0; box-shadow: 0 1px 2px rgba(2, 5, 10, .06); text-decoration: none; transition: background-color .3s, color .3s; }
	a.rs-wa-fab { cursor: pointer; }
	a.rs-wa-fab:hover, a.rs-wa-fab:focus-visible { background: #02050a; color: #fff; }
	a.rs-wa-fab:focus-visible { outline: 2px solid #02050a; outline-offset: 3px; box-shadow: 0 0 0 5px rgba(85, 230, 165, .55); }
}
@media (prefers-reduced-motion: reduce) { .rs-wa-fab { transition: none; } }
@media print { .rs-wa-fab { display: none !important; } }

/* Audit 2026-10-21: QA pre-launch fixes */
/* D1: dark header > breadcrumb > hero flow without the block-gap strip (also hero > list on /ghiduri/) */
.site-content > .rs-crumbs + *, .site-content > .rs-crumbs + .wp-block-post-content > :first-child, .site-content > .rs-gd-head + *, .site-content .rs-gd-head + .rs-gd-list { margin-block-start: 0 !important; }
/* D3: the plans block runs straight into the form block (the portfolio teaser used to sit between them) */
.rs-plans-sec:has(+ .rs-pricing) { padding-bottom: calc(var(--rs-sec) * .4); }
.rs-plans-sec:has(+ .rs-pricing) + .rs-pricing { padding-top: calc(var(--rs-sec) * .5); }
/* D6: footer links keep their look, hit height at least 24px */
footer.wp-block-template-part :is(.rs-footer-links, .rs-footer-contact, .rs-footer-legal) a { display: inline-flex; align-items: center; min-height: 24px; padding-block: 3px; }
/* D5: the cookie button leaves the screen while the mobile menu is open, like the bar */
@media (max-width: 781px) { body:has(.rs-nav.is-open) .rs-consent-fab { display: none; } }

/* "Pentru cine este" (/site-ieftin/): three open columns in the site's own idiom (thin rule turning mint on hover, mint check circle as in .rs-checks), no boxes. Padding !important beats Ollie's ".entry-content :not(.wp-block-group) > li:first-child { padding-top: 0 }" */
.wp-block-post-content .rs-st-lead + .rs-who-cards { gap: 0 clamp(1.5rem, 3vw, 2.5rem); margin-top: .75rem !important; }
.rs-who-cards li { position: relative; display: flex; flex-direction: column; gap: .5rem; margin: 0 !important; padding: 1.5rem 0 0 2rem !important; border-top: 1px solid var(--rs-line); border-bottom: 0; transition: border-color .3s ease; }
.rs-who-cards li:hover { border-top-color: var(--rs-mint); }
.rs-who-cards li::before { content: ""; position: absolute; left: 0; top: calc(1.5rem + .2em); width: 1.1rem; height: 1.1rem; border: 1.5px solid var(--rs-mint); border-radius: 50%; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 12.5l3.2 3.2L17 9' fill='none' stroke='%2355e6a5' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat; }
.rs-who-cards strong { font-size: 1.125rem; font-weight: 600; line-height: 1.4; color: var(--rs-head); }
.rs-who-cards span { font-size: .9375rem; font-weight: 400; line-height: 1.6; color: var(--rs-body); hyphens: manual; text-wrap: pretty; }
@media (max-width: 781px) { .rs-who-cards li { padding-bottom: 1.5rem !important; } }
@media (prefers-reduced-motion: reduce) { .rs-who-cards li { transition: none; } }

/* ---------- /portofoliu/ restyle (2026-10-22): alternating project rows, dark stage + browser frame, link pills. Page-scoped (.rs-pf-*); home keeps .rs-pcard ---------- */
.rs-pf-list { padding-block: clamp(.5rem, 2vw, 1.5rem) var(--rs-sec); }
.rs-pf-list .rs-cardsec-in { counter-reset: rs-pf; }
.rs-pf-row { counter-increment: rs-pf; display: grid !important; grid-template-columns: minmax(0, 1fr); gap: clamp(1.5rem, 3vw, 2.5rem) !important; align-items: center; margin: 0 !important; padding-block: clamp(2.5rem, 5vw, 4.5rem); border-bottom: 1px solid var(--rs-line); transition: border-color .3s ease; }
.rs-pf-row > * { margin: 0 !important; }
.rs-pf-row:hover, .rs-pf-row:focus-within { border-bottom-color: var(--rs-mint); }
.rs-pf-stage { position: relative; padding: clamp(1.25rem, 3.5vw, 3rem); background: radial-gradient(70% 90% at 88% 6%, rgba(85, 230, 165, .3), transparent 62%), var(--rs-ink); transition: box-shadow .4s ease; }
.rs-pf-row:hover .rs-pf-stage, .rs-pf-row:focus-within .rs-pf-stage { box-shadow: 0 0 60px rgba(85, 230, 165, .28); }
.rs-pf-shot { margin: 0 !important; overflow: hidden; background: #fff; border: 1px solid rgba(255, 255, 255, .18); box-shadow: 0 30px 60px -26px rgba(0, 0, 0, .8); transition: border-color .3s ease; }
.rs-pf-row:hover .rs-pf-shot, .rs-pf-row:focus-within .rs-pf-shot { border-color: var(--rs-mint); }
.rs-pf-shot::before { content: ""; display: block; height: 30px; background:
	radial-gradient(circle 4px at 16px 50%, rgba(255, 255, 255, .3) 96%, transparent) , radial-gradient(circle 4px at 32px 50%, rgba(255, 255, 255, .3) 96%, transparent),
	radial-gradient(circle 4px at 48px 50%, rgba(255, 255, 255, .3) 96%, transparent), linear-gradient(rgba(255, 255, 255, .09), rgba(255, 255, 255, .09)) center / min(46%, 360px) 14px no-repeat, #141a22; }
.rs-pf-shot a { display: block; overflow: hidden; }
.rs-pf-shot a:focus-visible { outline: 3px solid var(--rs-mint); outline-offset: -3px; }
.rs-pf-shot img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: top center; transition: transform .8s ease; }
.rs-pf-row:hover .rs-pf-shot img, .rs-pf-row:focus-within .rs-pf-shot img { transform: scale(1.03); }
.rs-pf-body::before { content: counter(rs-pf, decimal-leading-zero); content: counter(rs-pf, decimal-leading-zero) / ""; display: block; font-family: "Inter Outline", Inter, system-ui, sans-serif; font-size: clamp(3rem, 6vw, 4.5rem); font-weight: 300; line-height: 1; letter-spacing: -.02em; color: transparent; -webkit-text-stroke: 1.3px var(--rs-head); }
.wp-block-post-content .rs-pf-body h3 { margin-top: .75rem !important; font-size: clamp(1.875rem, 1.2rem + 2.4vw, 3rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.08; overflow-wrap: anywhere; }
.rs-pf-type { display: inline-flex; align-items: center; gap: .55rem; width: fit-content; max-width: 100%; margin-top: 1.1rem !important; padding: .4rem .95rem; border: 1px solid var(--rs-line); border-radius: 999px; font-size: .9375rem; font-weight: 600; line-height: 1.35; color: var(--rs-green); }
.rs-pf-type::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--rs-mint); }
.rs-pf-desc { margin-top: 1.25rem !important; max-width: 52ch; font-size: clamp(1.0625rem, 1rem + .35vw, 1.25rem); line-height: 1.6; color: var(--rs-body); }
.rs-pf-res { margin-top: 1.5rem !important; padding-top: 1.25rem; border-top: 1px solid var(--rs-line); max-width: 52ch; font-size: 1rem; line-height: 1.6; color: var(--rs-body); }
.rs-pf-res strong { color: var(--rs-head); }
.rs-pf-link { margin-top: 1.5rem !important; font-size: 1.0625rem; }
.rs-pf-link a { min-height: 24px; }
@media (min-width: 960px) {
	.rs-pf-row { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2.5rem, 5vw, 5rem) !important; }
	.rs-pf-row:nth-child(even) { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
	.rs-pf-row:nth-child(even) .rs-pf-stage { grid-column: 2; grid-row: 1; }
	.rs-pf-row:nth-child(even) .rs-pf-body { grid-column: 1; grid-row: 1; }
}
.rs-pf-note { position: relative; overflow: hidden; isolation: isolate; }
.rs-pf-note::before { content: ""; position: absolute; z-index: -1; right: -10%; top: -30%; width: min(60vw, 720px); aspect-ratio: 1; background: radial-gradient(circle, rgba(85, 230, 165, .22), transparent 65%); pointer-events: none; }
.wp-block-post-content .rs-pf-note .rs-intro { max-width: 36ch; margin-top: clamp(1.25rem, 2.5vw, 2rem) !important; font-size: clamp(1.375rem, 1rem + 1.7vw, 2.25rem); font-weight: 500; letter-spacing: -.015em; line-height: 1.8; color: var(--rs-head); }
.rs-pf-note .rs-intro a { display: inline-flex; align-items: center; gap: .4em; margin-block: .1em; padding: .05em .65em; background: #fff; border: 1px solid #cfd3d9; border-radius: 999px; font-weight: 600; color: var(--rs-ink); text-decoration: none; line-height: 1.5; transition: background-color .25s ease, border-color .25s ease; }
.rs-pf-note .rs-intro a::after { content: ""; width: .6em; height: .6em; background: currentColor; -webkit-mask: var(--rs-arrow) center / contain no-repeat; mask: var(--rs-arrow) center / contain no-repeat; transition: transform .25s ease; }
.rs-pf-note .rs-intro a:hover { background: var(--rs-mint); border-color: var(--rs-mint); }
.rs-pf-note .rs-intro a:hover::after { transform: translate(2px, -2px); }
.rs-pf-note .rs-intro a:focus-visible { outline: 2px solid var(--rs-ink); outline-offset: 3px; }
.rs-pf-note .rs-nw { white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .rs-pf-row, .rs-pf-stage, .rs-pf-shot, .rs-pf-shot img, .rs-pf-note .rs-intro a, .rs-pf-note .rs-intro a::after { transition: none; } .rs-pf-row:hover .rs-pf-shot img, .rs-pf-row:focus-within .rs-pf-shot img, .rs-pf-note .rs-intro a:hover::after { transform: none; } }

/* ---------- /despre-noi/ restyle (2026-10-22): open statement + dark stage with numbered service rows. Page-scoped (.rs-about-*); same look as .rs-pf ---------- */
.rs-about-sec { padding-block: clamp(3.5rem, 7vw, 6.5rem); }
.rs-about-sec .rs-about-in { display: grid !important; grid-template-columns: minmax(0, 1fr); gap: clamp(1.75rem, 4vw, 3rem) !important; align-items: start; }
.rs-about-in > * { margin: 0 !important; }
.wp-block-post-content .rs-about-head h2 { font-size: clamp(2.25rem, 1.4rem + 3vw, 3.75rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.05; }
.rs-about-who { position: relative; overflow: hidden; isolation: isolate; }
.rs-about-who::before { content: ""; position: absolute; z-index: -1; right: -10%; top: -30%; width: min(60vw, 720px); aspect-ratio: 1; background: radial-gradient(circle, rgba(85, 230, 165, .22), transparent 65%); pointer-events: none; }
.wp-block-post-content .rs-about-statement { max-width: 28ch; font-size: clamp(1.5rem, 1.05rem + 1.9vw, 2.5rem); font-weight: 500; letter-spacing: -.015em; line-height: 1.35; color: var(--rs-head); text-wrap: balance; }
.rs-about-what { background: radial-gradient(70% 80% at 92% 0%, rgba(85, 230, 165, .28), transparent 62%), var(--rs-ink); }
.wp-block-post-content .rs-about-what .rs-about-head h2 { color: #fff; }
.rs-about-link { margin-top: 1.25rem !important; font-size: 1.0625rem; }
.rs-about-head h2 + .rs-about-link { margin-top: 1.75rem !important; }
.rs-about-link + .rs-about-link { margin-top: .75rem !important; }
.wp-block-post-content .rs-about-link a { min-height: 44px; padding: .5rem 1.15rem; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; color: #fff; text-decoration: none; transition: background-color .25s ease, border-color .25s ease, color .25s ease; }
.rs-about-link a:hover { background: var(--rs-mint); border-color: var(--rs-mint); color: var(--rs-ink); }
.rs-about-link a:focus-visible { outline: 3px solid var(--rs-mint); outline-offset: 3px; }
.wp-block-post-content .rs-about-list { counter-reset: rs-ab; list-style: none; margin: 0; padding: 0 !important; border-top: 1px solid rgba(255, 255, 255, .18); }
.wp-block-post-content .rs-about-list li { counter-increment: rs-ab; position: relative; margin: 0; padding: 0 !important; border-bottom: 1px solid rgba(255, 255, 255, .18); transition: border-color .3s ease; }
.rs-about-list li:hover, .rs-about-list li:focus-within { border-bottom-color: var(--rs-mint); }
.rs-about-list a { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr) 1.1rem; align-items: center; gap: 1rem; min-height: 44px; padding-block: 1.35rem; font-size: clamp(1.1875rem, 1rem + .8vw, 1.625rem); font-weight: 600; letter-spacing: -.015em; line-height: 1.3; color: #fff; text-decoration: none; transition: color .25s ease, padding-left .3s ease; }
.rs-about-list a::before { content: counter(rs-ab, decimal-leading-zero); content: counter(rs-ab, decimal-leading-zero) / ""; font-family: "Inter Outline", Inter, system-ui, sans-serif; font-size: 1.5rem; font-weight: 300; line-height: 1; color: transparent; -webkit-text-stroke: 1px #fff; }
.rs-about-list a::after { content: ""; width: 1.1rem; height: 1.1rem; background: var(--rs-mint); -webkit-mask: var(--rs-arrow) center / contain no-repeat; mask: var(--rs-arrow) center / contain no-repeat; transition: transform .25s ease; }
.rs-about-list a:hover { color: var(--rs-mint); text-decoration: none; }
.rs-about-list a:hover::after { transform: translate(2px, -2px); }
.rs-about-list a:focus-visible { outline: 3px solid var(--rs-mint); outline-offset: -3px; }
@media (min-width: 960px) {
	.rs-about-sec .rs-about-in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2.5rem, 5vw, 5rem) !important; }
	.rs-about-list li:hover a { padding-left: .5rem; }
}
@media (prefers-reduced-motion: reduce) { .rs-about-link a, .rs-about-list li, .rs-about-list a, .rs-about-list a::after { transition: none; } .rs-about-list li:hover a { padding-left: 0; } .rs-about-list a:hover::after { transform: none; } }

/* ---------- Home: compact "Proiecte realizate" strip (2026-10-22). Four 16:10 desktop screenshots (1280x800 crops) in a light browser frame, each linking out to the live client site. Scoped .rs-hpf-* ---------- */
.wp-block-group.alignfull.rs-cardsec.rs-hpf { padding-block: 0 clamp(3rem, 6vw, 5rem); }
.rs-hpf-head { display: flex !important; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 2rem !important; }
.wp-block-post-content .rs-hpf-head h2 { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); line-height: 1.25; }
.rs-hpf-head > * { margin: 0 !important; }
.rs-hpf-more a { min-height: 24px; }
.rs-hpf-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(.75rem, 2vw, 1.5rem); margin: clamp(1.25rem, 2.5vw, 2rem) 0 0 !important; padding: 0 !important; list-style: none; }
@media (min-width: 1200px) { .rs-hpf-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rs-hpf-grid li { margin: 0; padding: 0; }
.rs-hpf-card { display: flex; flex-direction: column; gap: .15rem; color: var(--rs-head); text-decoration: none; }
.rs-hpf-shot { display: block; overflow: hidden; margin-bottom: .5rem; background: var(--rs-tint); border: 1px solid var(--rs-line); transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.rs-hpf-shot::before { content: ""; display: block; height: 14px; border-bottom: 1px solid var(--rs-line); background: radial-gradient(circle 2.5px at 9px 50%, rgba(24, 24, 24, .2) 96%, transparent), radial-gradient(circle 2.5px at 19px 50%, rgba(24, 24, 24, .2) 96%, transparent), radial-gradient(circle 2.5px at 29px 50%, rgba(24, 24, 24, .2) 96%, transparent), var(--rs-tint); }
.rs-hpf-shot img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; }
.rs-hpf-name { display: flex; align-items: center; gap: .4em; min-height: 24px; font-size: 1rem; font-weight: 600; line-height: 1.5; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 5px; transition: text-decoration-color .25s; }
.rs-hpf-name::after { content: ""; flex: none; width: .75em; height: .75em; background: currentColor; -webkit-mask: var(--rs-arrow) center / contain no-repeat; mask: var(--rs-arrow) center / contain no-repeat; transition: transform .25s ease; }
.rs-hpf-type { font-size: .875rem; line-height: 1.4; color: var(--rs-body); }
.rs-hpf-card:hover .rs-hpf-shot, .rs-hpf-card:focus-visible .rs-hpf-shot { transform: translateY(-4px); border-color: var(--rs-mint); box-shadow: 0 0 30px rgba(85, 230, 165, .25); }
.rs-hpf-card:hover .rs-hpf-name, .rs-hpf-card:focus-visible .rs-hpf-name { text-decoration-color: var(--rs-mint); }
.rs-hpf-card:hover .rs-hpf-name::after, .rs-hpf-card:focus-visible .rs-hpf-name::after { transform: translate(2px, -2px); }
.rs-hpf-card:focus-visible { outline: 2px solid var(--rs-ink); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { .rs-hpf-shot, .rs-hpf-name, .rs-hpf-name::after { transition: none; } .rs-hpf-card:hover .rs-hpf-name::after, .rs-hpf-card:focus-visible .rs-hpf-name::after { transform: none; } .rs-hpf-card:hover .rs-hpf-shot, .rs-hpf-card:focus-visible .rs-hpf-shot { transform: none; } }