@font-face {
  font-family:Poppins;
  src:url('/assets/Poppins-Regular.woff2') format('woff2');
  font-weight:400;
  font-display:swap;
}
@font-face {
  font-family:Poppins;
  src:url('/assets/Poppins-Bold.woff2') format('woff2');
  font-weight:700;
  font-display:swap;
}
/* Fallback faces with Poppins metrics (measured on the help text over Arial / Liberation Sans): the text keeps its
   width and line height while the web font loads, so the swap moves nothing (CLS). */
@font-face {
  font-family:'Poppins Fallback';
  src:local('Arial'),local('Liberation Sans');
  font-weight:400;
  size-adjust:112.04%;
  ascent-override:93.72%;
  descent-override:31.24%;
  line-gap-override:8.93%;
}
@font-face {
  font-family:'Poppins Fallback';
  src:local('Arial Bold'),local('Arial'),local('Liberation Sans Bold');
  font-weight:700;
  size-adjust:107.05%;
  ascent-override:98.09%;
  descent-override:32.69%;
  line-gap-override:9.34%;
}
:root {
  --ink:#16152b;
  --muted:#626174;
  --purple:#6c3fe0;
  --purple-dark:#5328bc;
  --yellow:#ffc83d;
  --lavender:#f5f1ff;
  --line:#e4e2ec;
  --radius:12px;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:24px;
}
body {
  margin:0;
  background:#fff;
  color:var(--ink);
  font-family:Poppins,'Poppins Fallback',Arial,sans-serif;
  font-size:15px;
  line-height:1.75;
}
a {
  color:inherit;
  text-decoration:none;
}
img {
  display:block;
  max-width:100%;
}
button,summary,a {
  -webkit-tap-highlight-color:transparent;
}
a,summary {
  touch-action:manipulation;
}
a:focus-visible,summary:focus-visible {
  outline:3px solid var(--purple);
  outline-offset:5px;
}
h1,h2,h3,p {
  margin:0;
}
h1,h2,h3 {
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.045em;
}
h1 {
  font-size:clamp(44px,4.7vw,66px);
}
h2 {
  font-size:clamp(30px,3.2vw,43px);
}
h3 {
  font-size:19px;
  letter-spacing:-.025em;
  line-height:1.4;
}
h1 span,h2 span:not(.dot) {
  color:var(--purple);
}
.dot {
  color:var(--yellow);
}
.container {
  width:calc(100% - 96px);
  max-width:1200px;
  margin-inline:auto;
}
.section {
  padding-block:88px;
}
.lead {
  font-size:17px;
  line-height:1.85;
  color:var(--muted);
}
.skip-link {
  position:fixed;
  top:10px;
  left:10px;
  z-index:10;
  background:var(--ink);
  color:#fff;
  padding:12px;
  transform:translateY(-180%);
}
.skip-link:focus {
  transform:translateY(0);
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  min-height:54px;
  padding:14px 23px;
  border:1px solid var(--purple);
  border-radius:var(--radius);
  background:var(--purple);
  color:#fff;
  font-size:14px;
  font-weight:700;
  line-height:1.5;
  transition:background .15s,transform .15s;
}
.button:hover {
  background:var(--purple-dark);
  border-color:var(--purple-dark);
  transform:translateY(-1px);
}
.button span {
  font-size:20px;
  line-height:1;
}
.button-outline {
  background:#fff;
  color:var(--ink);
  border-color:var(--line);
}
.button-outline:hover {
  color:var(--purple);
  background:var(--lavender);
  border-color:var(--purple);
}
.button-small {
  min-height:46px;
  padding:10px 20px;
}
.site-header {
  padding-block:21px;
}
.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
}
.brand {
  flex-shrink:0;
}
.brand img {
  display:block;
  aspect-ratio:174/46;
}
.header-inner nav {
  display:flex;
  gap:28px;
  font-size:13px;
}
.header-inner nav a:hover,footer a:hover {
  color:var(--purple);
}
.hero {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  align-items:center;
  gap:64px;
  padding-top:35px;
  padding-bottom:94px;
}
.hero-copy {
  padding-block:20px;
}
.hero .lead {
  margin-top:28px;
  max-width:540px;
}
.actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:32px;
}
.hero-note {
  font-size:12px;
  color:var(--muted);
  line-height:1.9;
  margin-top:24px;
}
.hero-note a {
  color:var(--ink);
  text-decoration:underline;
  text-underline-offset:3px;
}
.hero-visual {
  position:relative;
  isolation:isolate;
}
.hero-visual:after {
  content:'';
  position:absolute;
  z-index:-1;
  background:var(--yellow);
  width:52%;
  height:43%;
  bottom:-28px;
  right:-28px;
  border-radius:0 100% 100% 0;
}
.hero-visual img {
  width:100%;
  height:550px;
  object-fit:cover;
  object-position:center 45%;
  border-radius:28px 28px 92px 28px;
}
.services {
  border-top:1px solid var(--line);
}
.section-heading {
  text-align:center;
}
.section-heading p {
  color:var(--muted);
  margin-top:18px;
}
.service-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0 40px;
  margin-top:44px;
}
.service-grid a {
  display:flex;
  align-items:center;
  gap:20px;
  border-bottom:1px solid var(--line);
  padding:28px 0;
  font-size:17px;
  font-weight:700;
  line-height:1.5;
}
.service-grid svg {
  flex:0 0 34px;
  width:34px;
  height:34px;
  fill:none;
  stroke:var(--purple);
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.service-caption {
  display:block;
  font-size:12px;
  font-weight:400;
  line-height:1.7;
  color:var(--muted);
  margin-top:4px;
}
.arrow {
  margin-inline-start:auto;
  color:var(--purple);
  font-size:20px;
}
.service-grid a:hover {
  color:var(--purple);
}
.catalog {
  margin-top:34px;
}
.catalog>summary {
  justify-content:center;
  border:0;
  color:var(--purple);
  font-size:14px;
  font-weight:700;
  gap:18px;
}
.catalog-content {
  padding:20px 0 0;
}
.catalog-content>p {
  max-width:740px;
  margin:0 auto 24px;
  text-align:center;
  color:var(--muted);
  font-size:13px;
}
.catalog-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0 32px;
  /* An opened domain no longer stretches its row neighbours into empty boxes (client audit, 11 November 2026). */
  align-items:start;
}
.domain {
  border-bottom:1px solid var(--line);
  scroll-margin-top:32px;
}
.domain summary {
  font-size:13px;
  line-height:1.6;
  min-height:72px;
  gap:15px;
}
.domain p {
  padding:0 0 22px;
  color:var(--muted);
  font-size:12px;
}
.domain ul {
  margin:0;
  padding-block:0 18px;
  padding-inline:18px 0;
  font-size:12px;
  color:var(--muted);
}
summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor:pointer;
  list-style:none;
  padding:21px 0;
  gap:28px;
}
summary::-webkit-details-marker {
  display:none;
}
summary>span {
  font-size:23px;
  flex-shrink:0;
  font-weight:400;
  color:var(--purple);
  transition:transform .15s;
}
details[open]>summary>span {
  transform:rotate(45deg);
}
.steps {
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  margin:45px 0 0;
  padding:0;
}
.steps li {
  display:flex;
  gap:22px;
}
.step-number {
  flex-shrink:0;
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border-radius:50%;
  background:var(--lavender);
  color:var(--purple);
  font-size:20px;
  font-weight:700;
}
.steps h3 {
  margin-top:4px;
  font-size:17px;
}
.steps p {
  font-size:13px;
  color:var(--muted);
  margin-top:12px;
}
.text-link {
  display:inline-block;
  color:var(--purple);
  font-size:13px;
  font-weight:700;
  margin-top:16px;
  text-decoration:underline;
  text-underline-offset:5px;
}
.professional {
  background:var(--lavender);
}
.pro-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:85px;
  align-items:center;
}
.professional .lead {
  margin:24px 0;
  max-width:480px;
}
.pro-note {
  font-size:11px;
  color:var(--muted);
  line-height:1.9;
  max-width:450px;
  margin-top:18px;
}
.pro-checklist {
  background:#fff;
  border-radius:20px;
  padding:32px 36px;
}
.pro-checklist h3 {
  font-size:18px;
  margin-bottom:10px;
}
.pro-checklist ul {
  padding:0;
  margin:0;
  list-style:none;
}
.pro-checklist li {
  display:flex;
  gap:18px;
  align-items:center;
  padding:24px 0;
  border-bottom:1px solid var(--line);
  font-size:14px;
}
.pro-checklist li>span {
  display:grid;
  place-items:center;
  flex-shrink:0;
  width:30px;
  height:30px;
  border-radius:50%;
  background:var(--yellow);
  font-size:18px;
  font-weight:700;
}
.pro-checklist small {
  display:block;
  font-size:11px;
  color:var(--muted);
  margin-top:4px;
}
.pro-checklist>p {
  font-size:11px;
  line-height:1.8;
  color:var(--muted);
  margin-top:20px;
}
.faq-grid {
  display:grid;
  grid-template-columns:1fr 1.35fr;
  gap:72px;
}
.faq-intro {
  color:var(--muted);
  font-size:14px;
  margin-top:20px;
}
.faq details {
  border-bottom:1px solid var(--line);
}
.faq details:first-child summary {
  padding-top:0;
}
.faq summary {
  font-size:14px;
  line-height:1.75;
  min-height:64px;
}
.faq p {
  font-size:13px;
  color:var(--muted);
  line-height:1.9;
  padding:0 20px 24px 0;
}
.closing {
  border-top:1px solid var(--line);
  padding-block:55px 72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}
.closing h2 {
  font-size:32px;
}
.closing p {
  color:var(--muted);
  font-size:13px;
  margin-top:16px;
}
footer {
  background:var(--ink);
  color:#fff;
  padding-block:36px 20px;
}
.footer-main {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  padding-bottom:32px;
}
.footer-main nav {
  display:flex;
  flex-wrap:wrap;
  gap:26px;
  font-size:12px;
}
.footer-main a:hover {
  color:var(--yellow);
}
.footer-bottom {
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid #ffffff26;
  padding-top:20px;
  font-size:10px;
  color:#c4c1d2;
}
.footer-bottom span {
  margin-inline:10px;
}
@media(min-width:1400px) {
  .hero {
    gap:75px;
  }
  .hero-visual img {
    height:590px;
  }
}
@media(max-width:1100px) {
  .container {
    width:calc(100% - 64px);
  }
  .header-inner nav {
    gap:18px;
    font-size:12px;
  }
  .brand img {
    width:160px;
    height:auto;
  }
  .hero {
    gap:34px;
  }
  .hero-visual img {
    height:520px;
  }
  .hero .lead {
    font-size:15px;
  }
  .actions {
    gap:10px;
  }
  .actions .button {
    font-size:12px;
    padding-inline:16px;
  }
  .service-grid {
    gap:0 24px;
  }
  .service-grid a {
    gap:14px;
    font-size:15px;
  }
  .service-caption {
    font-size:10px;
  }
  .steps {
    gap:24px;
  }
  .steps li {
    gap:14px;
  }
  .steps h3 {
    font-size:15px;
  }
  .pro-grid {
    gap:40px;
  }
  .faq-grid {
    gap:40px;
  }
}
@media(max-width:760px) {
  .container {
    width:calc(100% - 48px);
  }
  .site-header {
    padding-block:16px;
  }
  .header-inner {
    gap:16px;
    flex-wrap:wrap;
  }
  .brand img {
    width:148px;
  }
  .header-inner nav {
    order:3;
    width:100%;
    justify-content:space-between;
    gap:8px;
    border-top:1px solid var(--line);
    padding-top:6px;
    font-size:11px;
  }
  /* Touch targets: navigation links were 19px tall on phones (measured in production on 11 November 2026).
     The padding replaces part of the surrounding gaps, so rows keep their pitch. */
  .header-inner nav a {
    padding-block:8px;
  }
  .button-small {
    font-size:12px;
    padding:10px 14px;
    min-height:44px;
  }
  .hero {
    grid-template-columns:1fr;
    padding-top:18px;
    padding-bottom:60px;
    gap:30px;
  }
  .hero-copy {
    padding:0;
  }
  .desktop-break {
    display:none;
  }
  h1 {
    font-size:clamp(38px,8.5vw,58px);
    line-height:1.13;
    max-width:610px;
  }
  .hero .lead {
    font-size:14px;
    margin-top:20px;
    max-width:600px;
  }
  .actions {
    margin-top:24px;
  }
  .actions .button {
    font-size:12px;
    flex:1 1 190px;
    min-height:50px;
  }
  .hero-note {
    font-size:11px;
    margin-top:18px;
  }
  .hero-visual {
    margin:0 14px 0 0;
  }
  .hero-visual img {
    height:350px;
    object-position:center 40%;
    border-radius:22px 22px 64px 22px;
  }
  .hero-visual:after {
    bottom:-18px;
    right:-16px;
    width:45%;
    height:50%;
  }
  .section {
    padding-block:56px;
  }
  h2 {
    font-size:30px;
  }
  .section-heading {
    text-align:start;
  }
  .section-heading p {
    font-size:13px;
    margin-top:14px;
  }
  .service-grid {
    grid-template-columns:1fr 1fr;
    gap:0 26px;
    margin-top:22px;
  }
  .service-grid a {
    font-size:14px;
    gap:12px;
    padding:23px 0;
  }
  .service-grid svg {
    width:28px;
    height:28px;
    flex-basis:28px;
  }
  .service-caption {
    display:none;
  }
  .arrow {
    font-size:16px;
  }
  .catalog-grid {
    grid-template-columns:1fr 1fr;
    gap:0 20px;
  }
  .catalog {
    margin-top:22px;
  }
  .catalog-content>p {
    text-align:start;
  }
  .steps {
    grid-template-columns:1fr;
    gap:28px;
    margin-top:30px;
  }
  .steps li {
    gap:20px;
  }
  .steps h3 {
    font-size:17px;
  }
  .steps p {
    margin-top:6px;
    max-width:440px;
  }
  .text-link {
    margin-top:8px;
  }
  .pro-grid {
    grid-template-columns:1fr;
    gap:30px;
  }
  .professional .lead {
    font-size:15px;
    margin-block:20px;
  }
  .pro-note {
    max-width:440px;
  }
  .pro-checklist {
    padding:24px;
  }
  .pro-checklist li {
    padding:20px 0;
  }
  .pro-checklist small {
    font-size:10px;
  }
  .faq-grid {
    grid-template-columns:1fr;
    gap:26px;
  }
  .faq-intro {
    font-size:13px;
    margin-top:14px;
  }
  .faq summary {
    font-size:13px;
  }
  .faq details:first-child summary {
    padding-top:16px;
  }
  .closing {
    align-items:flex-start;
    flex-direction:column;
    padding-block:40px 50px;
  }
  .closing h2 {
    font-size:29px;
  }
  .footer-main {
    align-items:flex-start;
    flex-direction:column;
    gap:24px;
  }
  .footer-main img {
    width:150px;
    height:auto;
  }
  .footer-main nav {
    gap:0 24px;
    font-size:11px;
  }
  .footer-main nav a {
    padding-block:6px;
  }
  .footer-bottom {
    flex-direction:column;
    gap:6px;
    font-size:10px;
  }
}
@media(max-width:380px) {
  .container {
    width:calc(100% - 36px);
  }
  .service-grid {
    gap:0 18px;
  }
  .service-grid a {
    font-size:12px;
  }
  .service-grid svg {
    flex-basis:24px;
    width:24px;
  }
  .catalog-grid {
    grid-template-columns:1fr;
  }
  .arrow {
    display:none;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*:before,*:after {
    transition:none!important;
  }
}

.footer-legal { display:flex; flex-wrap:wrap; gap:14px 28px; padding-bottom:28px; font-size:12px; line-height:1.6; }
.footer-legal a { color:#ded9ee; }
.footer-legal a:hover { color:white; text-decoration:underline; }

.language-navigation { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px 20px; margin-top:14px; font-size:12px; line-height:1.6; }
.language-navigation a { padding-block:5px; color:var(--muted); border-bottom:2px solid transparent; }
.language-navigation a:hover,.language-navigation a[aria-current="page"] { color:var(--purple); border-bottom-color:var(--purple); }
.not-found { padding-block:40px 72px; }
.not-found-code { color:var(--purple); font-size:clamp(4rem,12vw,7rem); font-weight:700; margin:0; line-height:1; }
.not-found h1 { margin-block:16px 28px; font-size:clamp(2rem,6vw,3.5rem); }
.not-found-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-block-start:28px; }
.not-found-grid section { padding:28px; border:1px solid #ded8ec; border-radius:24px; background:#fff; scroll-margin-block-start:24px; }
.not-found-grid h2 { font-size:1.3rem; margin-block:0 12px; }
.not-found-grid p { margin-block:0 24px; }
.not-found-grid .text-link { display:block; margin-block-start:18px; }
.not-found [lang="ary"] { font-family:Tahoma,Arial,sans-serif; }
@media(max-width:640px) { .not-found-grid { grid-template-columns:1fr; } }
[dir="rtl"] body { font-family:Tahoma,Arial,sans-serif; }
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3 { letter-spacing:normal; line-height:1.4; }
[dir="rtl"] .faq p { padding-inline:0 20px; }
[dir="rtl"] .brand,[dir="rtl"] .hero-visual,[dir="rtl"] .footer-main>img { direction:ltr; }
/* Same touch-target rule for the two blocks declared above this line; the margins shrink by what the links gained.
   Only the home page has its language menu right under the header navigation, hence the scoped margin. */
@media(max-width:760px) { .language-navigation { justify-content:flex-start; gap:8px 18px; margin-top:10px; } .site-header>.language-navigation { margin-top:2px; } .footer-legal { row-gap:0; padding-bottom:21px; } .footer-legal a { padding-block:7px; } }

.service-guides-link { margin-block:28px; font-size:14px; line-height:1.8; }
.domain>p { padding:0 20px 20px; font-size:13px; line-height:1.8; }
