/* RPCS DESIGN LANGUAGE / 2030
   Calm, future-facing editorial UI. Verdana, existing palette and visible logo remain. */
:root {
  --glass: rgb(244 248 250 / 88%);
  --ink-weak: rgb(30 51 64 / 68%);
  --hairline: rgb(122 158 175 / 32%);
  --edge: rgb(30 51 64 / 11%);
  --halo: 0 16px 44px rgb(30 51 64 / 9%);
}
html { text-rendering: optimizeLegibility; }
body { background: var(--ice); }
h1, h2, h3 { text-wrap: balance; }
a { transition: color .18s ease; }
.site-header { border-bottom: 1px solid var(--hairline); background: var(--glass); box-shadow: 0 8px 28px rgb(30 51 64 / 4%); }
@supports (backdrop-filter: blur(15px)) { .site-header { backdrop-filter: blur(20px) saturate(125%); } }
.logo { letter-spacing: -.045em; }
.main-nav>a[aria-current="page"] { color: var(--coral); }
.main-nav>a:not(.nav-contact):focus-visible { border-radius: 4px; }
.main-nav .nav-contact { background: var(--ink); box-shadow: 0 7px 18px rgb(30 51 64 / 12%); }
.button { letter-spacing: -.008em; }
.button-primary { box-shadow: 0 7px 19px rgb(185 79 61 / 16%); }
.button:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
/* Future-forward editorial hero: purposeful geometry rather than extra photos or heavy JS */
.hero-home { isolation: isolate; background: linear-gradient(119deg, #F4F8FA 0%, #E5EFF3 48%, #CFDFE6 100%); }
.hero-home::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgb(122 158 175 / 40%) .75px, transparent 1px);
  background-size: 19px 19px;
  mask-image: linear-gradient(90deg, transparent 16%, #000 100%);
  opacity: .5;
}
.hero-home::after {
  content: ""; position: absolute; right: -14%; top: -64%; width: min(74vw,900px); aspect-ratio: 1;
  border: 1px solid rgb(122 158 175 / 30%); border-radius: 50%; pointer-events: none; z-index: -1;
}
.eyebrow { letter-spacing: .14em; }
.hero-home h1 { font-size: clamp(43px,5.8vw,77px); letter-spacing: -.073em; line-height: 1.05; }
.hero h1 span { color: var(--coral); }
.hero-visual { perspective: 950px; }
.hero-visual-orbit { border-color: rgb(30 51 64 / 13%); }
.orbit-b { border-color: rgb(122 158 175 / 48%); }
.visual-panel {
  transform: rotate(-2deg); border-color: rgb(229 239 243 / 15%);
  background: radial-gradient(circle at 95% 0%, rgb(149 182 196 / 30%), transparent 47%), linear-gradient(140deg,#1E3340 10%, #25414E 100%);
  box-shadow: 16px 22px 0 rgb(122 158 175 / 22%), 0 23px 45px rgb(30 51 64 / 15%);
  overflow: hidden;
}
.visual-panel::after {
  content: ""; position: absolute; top: -90px; right: -85px; width: 235px; aspect-ratio: 1;
  border: 1px solid rgb(229 239 243 / 19%); border-radius: 50%; pointer-events: none;
}
.panel-symbol { color: var(--mist); }
.visual-floating { border-color: var(--dust); box-shadow: var(--halo); background: rgb(244 248 250 / 92%); }
.panel-bottom { font-size: 8px; }
.hero-bottom { gap: 12px 22px; border-color: var(--hairline); }
.hero-bottom span { white-space: nowrap; }
/* Editorial service index replaces cramped tiles. */
.services-2030 { background: linear-gradient(180deg, var(--ice), var(--mist)); }
.services-2030 .section-heading { margin-bottom: 25px; }
.services-2030 .section-heading p:last-child { max-width: 325px; line-height: 1.7; }
.service-index {
  display: grid; grid-template-columns: repeat(2, minmax(0,1fr));
  column-gap: 39px; border-top: 1px solid var(--hairline);
}
.service-index-item {
  position: relative; min-width: 0; display: grid; align-items: center;
  grid-template-columns: 39px minmax(0, 1fr) auto; gap: 16px;
  padding: 22px 8px 21px 3px; border-bottom: 1px solid var(--hairline);
  transition: background .2s ease, padding .2s ease;
}
.service-index-item::before {
  content: ""; position: absolute; left: 0; top: 17px; bottom: 17px; width: 3px;
  background: var(--coral); opacity: 0; transform: scaleY(.4);
  transform-origin: center; transition: transform .22s, opacity .22s;
}
.service-index-item:hover, .service-index-item:focus-within { background: rgb(255 255 255 / 48%); }
.service-index-item:hover::before, .service-index-item:focus-within::before { opacity: 1; transform: scaleY(1); }
.index-nr { align-self: start; margin-top: 25px; color: var(--ink-weak); font-size: 10px; font-weight: 700; letter-spacing: .14em; font-variant-numeric: tabular-nums; }
.index-category { margin-bottom: 6px; color: var(--ink-weak); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; }
.index-content h3 { font-size: clamp(17px,1.4vw,21px); letter-spacing: -.04em; }
.index-content h3 a { display: inline-block; text-decoration: none; }
.index-content h3 a:hover { color: var(--coral); }
.index-arrow { display: inline-block; font-size: .83em; color: var(--coral); transition: transform .2s; }
.index-content h3 a:hover .index-arrow { transform: translate(3px,-3px); }
.index-description { margin-top: 7px; font-size: 11px; color: var(--ink); line-height: 1.6; max-width: 290px; }
.index-download {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; align-self: center;
  white-space: nowrap; font-size: 10px; font-weight: bold; text-decoration: none;
  min-height: 37px; padding: 7px 12px; border: 1px solid var(--hairline); border-radius: 100px;
  background: rgb(244 248 250 / 64%);
}
.index-download:hover { border-color: var(--coral); color: var(--coral); background: white; }
.index-download span { font-size: 14px; line-height: 1; }
.index-design .index-content h3 a { text-decoration: underline; text-decoration-color: var(--petrol-light); text-underline-offset: 5px; }
.index-freelancer .index-category { color: var(--coral); }
/* Thematic depth without making sections longer */
.spotlight { background: var(--ice); }
.spotlight-grid { align-items: center; }
.spotlight h2, .freelance-banner h2, .workflow h2, .contact-card h2 { letter-spacing: -.055em; }
.feature-pills span { background: rgb(229 239 243 / 65%); border-color: var(--hairline); }
.preview-browser { transform: rotate(1deg); box-shadow: 16px 19px 0 var(--pastel), 0 22px 52px rgb(30 51 64 / 12%); }
.preview-inner { background: linear-gradient(135deg, var(--mist), var(--pastel)); }
.freelance-banner { position: relative; overflow: hidden; }
.freelance-banner::before {
  content: ""; position: absolute; width: min(80vw,700px); aspect-ratio: 1; right: -19%; top: -160%;
  border: 1px solid rgb(229 239 243 / 17%); border-radius: 50%; pointer-events: none;
}
.workflow-grid { gap: 12px; }
.workflow-grid li { background: linear-gradient(145deg,var(--mist),var(--ice)); border-top-color: var(--petrol); }
.workflow-grid li:nth-child(2), .workflow-grid li:nth-child(4) { border-top-color: var(--coral); }
.contact-card { background: linear-gradient(118deg,var(--pastel),var(--mist)); border: 1px solid var(--hairline); }
.contact-card::after { border-color: var(--petrol); }
.contact-address { word-break: break-word; }
.footer-grid { align-items: start; }
/* Inner pages: information hierarchy first, no card wall */
.service-hero { background: linear-gradient(128deg,var(--ice),var(--mist) 55%,var(--pastel)); }
.service-hero h1 { font-size: clamp(36px,4.8vw,65px); letter-spacing: -.058em; }
.service-summary {
  background: radial-gradient(circle at 100% 0%,rgb(149 182 196 / 24%),transparent 64%),var(--ink);
  box-shadow: 12px 14px 0 rgb(178 203 214 / 69%);
}
.service-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 28px; }
.service-card {
  min-height: 0; padding: 19px 12px 18px 0; border: 0; border-bottom: 1px solid var(--hairline);
  border-radius: 0; background: transparent;
}
.service-card::before { height: 2px; width: 25px; margin-bottom: 13px; background: var(--petrol); }
.service-card h3 { font-size: clamp(16px,1.55vw,19px); letter-spacing: -.035em; }
.service-card p { max-width: 460px; font-size: 12px; line-height: 1.65; }
.service-pdf-bar { background: var(--mist); border-color: var(--hairline); border-radius: 16px; }
.related-services { background: var(--ice); }
.related-links a { border-color: var(--hairline); }
.related-links a:hover { background: var(--mist); }
.process-section { background: var(--ink); }
.breadcrumbs { color: var(--ink); }
.breadcrumbs a:hover { color: var(--coral); }
@media (hover: none) {
  .service-index-item:hover { background: transparent; }
  .service-index-item:hover::before { opacity: 0; }
}
@media (max-width: 1000px) {
  .service-index { column-gap: 22px; }
  .service-index-item { grid-template-columns: 29px minmax(0,1fr); gap: 9px; }
  .index-download { grid-column: 2; justify-self: start; min-height: 32px; padding: 5px 10px; margin-top: 3px; }
  .index-nr { margin-top: 24px; }
}
@media (max-width: 760px) {
  .hero-home::before { opacity: .25; }
  .hero-home h1 { font-size: clamp(36px,9.5vw,58px); }
  .service-index { grid-template-columns: 1fr; }
  .service-index-item { grid-template-columns: 30px minmax(0,1fr) auto; gap: 10px; padding: 18px 6px 18px 2px; }
  .index-download { grid-column: 3; align-self: center; margin-top: 0; }
  .index-nr { margin-top: 25px; }
  .service-hero h1 { font-size: clamp(34px,8vw,50px); }
  .service-grid { grid-template-columns: 1fr; }
  .service-card { padding: 17px 5px 17px 0; }
  .service-summary { box-shadow: 8px 8px 0 var(--dust); }
  .freelance-banner::before { display: none; }
}
@media (max-width: 440px) {
  .service-index-item { grid-template-columns: 24px minmax(0,1fr); gap: 10px; }
  .index-download { grid-column: 2; justify-self: start; margin-top: 7px; }
  .index-nr { margin-top: 23px; }
  .hero-home::after { display: none; }
  .visual-floating { font-size: 10px; padding: 9px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .service-index-item, .service-index-item::before, .index-arrow { transition: none !important; }
}

/* Service Explorer 2030: purposeful selection instead of tiles or an index. */
.services-2030 {
  background: linear-gradient(145deg, var(--ice), var(--mist) 65%,var(--pastel));
  padding-block: clamp(46px,6vw,82px);
}
.explorer-intro {
  display: grid; grid-template-columns: 1.1fr .9fr; gap: 35px;
  justify-content: space-between; align-items: end; margin-bottom: 27px;
}
.explorer-intro h2 { font-size: clamp(32px,3.7vw,54px); letter-spacing: -.057em; }
.explorer-intro h2 span { color: var(--coral); }
.explorer-intro>p { max-width: 400px; margin-left: auto; padding-bottom: 4px; font-size: 13px; line-height: 1.8; }
.service-explorer {
  display: grid; grid-template-columns: minmax(225px,.72fr) minmax(0,1.28fr);
  min-height: 445px; border: 1px solid var(--hairline); border-radius: 23px;
  background: rgb(244 248 250 / 81%); overflow: hidden;
  box-shadow: 0 25px 65px rgb(30 51 64 / 10%);
}
.explorer-picker { display: flex; flex-direction: column; min-width: 0; padding: 25px 17px; border-right: 1px solid var(--hairline); }
.explorer-picker-label { display: flex; justify-content: space-between; gap: 10px; padding: 0 13px 15px; color: var(--ink-weak); font-size: 9px; letter-spacing: .15em; font-weight: bold; }
.explorer-choice {
  min-width: 0; display: grid; grid-template-columns: 23px minmax(0,1fr) 18px; align-items: center; gap: 12px;
  padding: 12px 13px; min-height: 44px; border-radius: 11px; text-decoration: none; font-size: 12px;
  font-weight: 700; color: var(--ink); transition: background .2s, color .2s, transform .2s;
}
.explorer-choice + .explorer-choice { margin-top: 2px; }
.explorer-choice:hover { background: var(--mist); }
.explorer-choice.is-active { background: var(--ink); color: white; box-shadow: 0 8px 19px rgb(30 51 64 / 13%); }
.choice-number { color: var(--petrol); font-size: 9px; font-variant-numeric: tabular-nums; letter-spacing: .12em; }
.explorer-choice.is-active .choice-number { color: var(--petrol-light); }
.choice-name { overflow-wrap: anywhere; }
.choice-chevron { justify-self: end; opacity: .5; }
.explorer-choice.is-active .choice-chevron { color: var(--dust); opacity: 1; }
.explorer-display {
  min-width: 0; position: relative; background: var(--ink); color: white;
  isolation: isolate;
}
.explorer-display::before {
  content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 85% 30%,rgb(149 182 196 / 19%), transparent 34%),
    linear-gradient(135deg, transparent 44%,rgb(122 158 175 / 8%) 80%);
}
.explorer-display::after {
  content: ""; position: absolute; right: -125px; top: -110px; width: 350px; aspect-ratio: 1;
  border: 1px solid rgb(149 182 196 / 24%); border-radius: 50%; pointer-events: none; z-index: -1;
}
.explorer-panel {
  display: flex; flex-direction: column; justify-content: space-between;
  min-height: 445px; padding: clamp(27px,3.4vw,46px);
}
.explorer-panel + .explorer-panel { border-top: 1px solid rgb(178 203 214 / 27%); }
.service-explorer.is-interactive .explorer-panel + .explorer-panel { border-top: 0; }
.explorer-panel[hidden] { display: none !important; }
.explorer-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.panel-overline, .explorer-panel-count { font-size: 9px; font-weight: 700; letter-spacing: .13em; color: var(--pastel); }
.panel-live-dot { display: inline-block; width: 6px; height: 6px; margin-right: 9px; vertical-align: middle; border-radius: 50%; background: var(--coral); }
.explorer-panel-count { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--petrol-light); }
.explorer-panel-body { max-width: 530px; margin: 23px 0 24px; }
.explorer-panel-label { font-size: 11px; color: var(--petrol-light); font-weight: 700; }
.explorer-panel-body h3 { font-size: clamp(29px,3.6vw,51px); margin: 12px 0 17px; letter-spacing: -.06em; line-height: 1.14; }
.explorer-panel-description { max-width: 475px; font-size: 13px; line-height: 1.85; color: var(--mist); }
.explorer-topics { display: flex; flex-wrap: wrap; gap: 7px; padding: 0; margin: 23px 0 0; list-style: none; }
.explorer-topics li { padding: 7px 11px; border: 1px solid rgb(178 203 214 / 36%); border-radius: 100px; color: var(--mist); font-size: 10px; }
.explorer-panel-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; padding-top: 17px; border-top: 1px solid rgb(178 203 214 / 28%); }
.explorer-primary, .explorer-secondary {
  display: inline-flex; align-items: center; justify-content: center; gap: 14px;
  min-height: 44px; padding: 11px 19px; border-radius: 99px; font-size: 11px;
  font-weight: 700; text-decoration: none; transition: transform .2s, background .2s;
}
.explorer-primary { color: white; background: var(--coral); }
.explorer-primary:hover { background: #A74434; transform: translateY(-2px); }
.explorer-secondary { color: var(--mist); border: 1px solid rgb(178 203 214 / 40%); }
.explorer-secondary:hover { background: rgb(229 239 243 / 12%); }
.explorer-footnote { margin-top: 15px; font-size: 10px; text-align: right; color: var(--ink-weak); }
@media(max-width:900px){
  .service-explorer { grid-template-columns: minmax(205px,.8fr) minmax(0,1.2fr); }
  .explorer-picker { padding: 20px 10px; }
  .explorer-choice { padding: 12px 9px; gap: 7px; }
  .explorer-panel { padding: 28px; }
  .explorer-intro>p { max-width: 310px; }
}
@media(max-width:720px){
  .explorer-intro { grid-template-columns: 1fr; gap: 13px; margin-bottom: 21px; }
  .explorer-intro>p { max-width: 100%; margin: 0; }
  .service-explorer { grid-template-columns: 1fr; border-radius: 18px; }
  .explorer-picker {
    flex-direction: row; align-items: center; overflow-x: auto; overscroll-behavior-x: contain;
    scrollbar-width: thin; scroll-snap-type: x proximity; padding: 10px; border-right: 0; border-bottom: 1px solid var(--hairline);
  }
  .explorer-picker-label { display: none; }
  .explorer-choice { display: flex; flex: none; min-height: 44px; white-space: nowrap; gap: 9px; border-radius: 11px; padding: 10px 13px; scroll-snap-align: start; }
  .explorer-choice + .explorer-choice { margin-top: 0; margin-left: 5px; }
  .choice-chevron { display: none; }
  .explorer-panel { min-height: 350px; padding: 26px; }
  .explorer-panel-body { margin: 21px 0 24px; }
  .explorer-panel-body h3 { font-size: clamp(28px,7.5vw,41px); }
  .explorer-footnote { text-align: left; }
}
@media(max-width:400px){
  .explorer-panel { padding: 21px; }
  .explorer-panel-footer { gap: 9px; }
  .explorer-primary,.explorer-secondary { font-size: 11px; min-height: 42px; padding: 9px 14px; }
}
/* Compact cookie-free privacy information. */
.privacy-hero { padding: clamp(44px,6vw,80px) 0 35px; background: linear-gradient(130deg,var(--ice),var(--mist)); border-bottom: 1px solid var(--hairline); }
.privacy-hero h1 { margin: 12px 0 18px; font-size: clamp(34px,5vw,65px); letter-spacing: -.055em; }
.privacy-hero p:not(.eyebrow) { max-width: 670px; line-height: 1.8; font-size: 13px; }
.privacy-layout { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: clamp(30px,6vw,100px); padding-top: 45px; padding-bottom: 70px; }
.privacy-toc { align-self: start; position: sticky; top: calc(var(--header-height) + 28px); display: flex; flex-direction: column; gap: 11px; padding: 21px; border: 1px solid var(--hairline); border-radius: 18px; background: var(--mist); }
.privacy-toc strong { margin-bottom: 4px; font-size: 12px; }
.privacy-toc a { font-size: 11px; text-decoration: none; }
.privacy-toc a:hover { color: var(--coral); text-decoration: underline; }
.privacy-text { max-width: 770px; }
.privacy-text section { padding: 0 0 27px; margin-bottom: 30px; border-bottom: 1px solid var(--hairline); }
.privacy-text h2 { margin-bottom: 12px; font-size: clamp(19px,2vw,26px); letter-spacing: -.04em; }
.privacy-text p, .privacy-text li { line-height: 1.87; font-size: 12px; }
.privacy-text p+p,.privacy-text p+ul { margin-top: 12px; }
.privacy-text ul { padding-left: 19px; }
.privacy-text li+li { margin-top: 5px; }
.privacy-text a { text-decoration-color: var(--petrol); text-underline-offset: 3px; }
.privacy-note { margin-top: 25px; padding: 19px; background: var(--mist); border-left: 3px solid var(--petrol); border-radius: 0 13px 13px 0; font-size: 12px; }
@media(max-width:720px) { .privacy-layout { grid-template-columns: 1fr; gap: 22px; padding-top: 27px; } .privacy-toc { position: static; display: flex; flex-direction: row; flex-wrap: wrap; gap: 7px 15px; }.privacy-toc strong { width: 100%; } }