/* TLDsKing v2 — original editorial identity and progressive-enhancement motion.
   Existing marketplace and account CSS remain in site.css. */
:root {
  --royal-ink: #21182f;
  --royal-ink-2: #35254f;
  --king-violet: #6749d6;
  --king-gold: #e8c279;
  --king-cream: #f8f5ef;
  --king-ease: cubic-bezier(.22,1,.36,1);
  --navy: #21182f;
  --blue: #6749d6;
  --blue-dark: #4d31b5;
  --green: #a47b38;
  --ink: #292239;
  --canvas: #faf8fb;
  --container: 1220px;
}
html { scroll-padding-top: 110px; }
body { font-family: "Avenir Next", "Segoe UI", Inter, system-ui, sans-serif; }
.announcement-bar { background: #251b37; color: #ded5e9; font-size: 11px; letter-spacing: .025em; }
.announcement-inner { min-height: 32px; display: flex; align-items: center; justify-content: center; gap: 14px; }
.announcement-star { color: var(--king-gold); margin-right: 6px; }
.announcement-bar a { color: #f4d998; font-weight: 800; }
.announcement-bar a:hover { color: #fff; }
.site-header { border: none; background: rgba(255,255,255,.965); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); box-shadow: 0 1px 0 rgba(41,27,68,.08); }
.header-inner { min-height: 80px; gap: 18px; }
.wordmark { gap: 11px; letter-spacing: -.055em; font-size: 23px; }
.wordmark .brand-symbol { display: block; width: 42px; height: 42px; flex: none; filter: drop-shadow(0 5px 9px rgba(65, 35, 105, .13)); transition: transform .35s var(--king-ease); }
.wordmark:hover .brand-symbol { transform: rotate(-5deg) scale(1.035); }
.wordmark-king { color: var(--king-violet); }
.wordmark-dot { color: #bb8741; }
.primary-nav { gap: clamp(11px, 1.6vw, 24px); }
.nav-link { font-size: 12px; font-weight: 700; color: #5c526c; white-space: nowrap; }
.nav-link.is-current, .nav-link:hover { color: var(--king-violet); }
.button-nav { color: #fff; background: var(--royal-ink); border-radius: 100px; padding-inline: 20px; }
.button-nav:hover { color: #fff; background: var(--king-violet); }
.king-kicker { margin: 0 0 17px; color: #8e6b37; font-size: 11px; font-weight: 850; letter-spacing: .18em; line-height: 1.5; }
.king-tag { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 25px; color: #f0d8a6; font-size: 11px; font-weight: 820; letter-spacing: .16em; }
.king-tag-star { display: grid; place-items: center; width: 27px; height: 27px; color: #342441; background: #e8c279; border-radius: 50%; font-size: 18px; line-height: 1; }
.king-italic, .king-services em, .king-featured em, .king-story em, .king-process em, .king-final-cta em, .king-footer-top em, .king-service-hero em, .king-service-content em { color: var(--king-gold); font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-style: italic; letter-spacing: -.06em; }
/* Hero */
.king-hero { position: relative; isolation: isolate; overflow: hidden; color: #fff; background: linear-gradient(116deg,#21172f 5%,#302044 49%,#49347a 100%); }
.king-ambient { position: absolute; pointer-events: none; z-index: -1; border-radius: 50%; filter: blur(1px); }
.king-ambient-one { top: -270px; right: -120px; width: 700px; height: 700px; background: radial-gradient(circle,#6545a5 0,rgba(120,81,180,.15) 49%,transparent 70%); }
.king-ambient-two { left: -350px; bottom: -330px; width: 650px; height: 650px; border: 1px solid rgba(235,205,148,.2); box-shadow: 0 0 0 90px rgba(255,255,255,.022),0 0 0 190px rgba(255,255,255,.013); }
.king-hero-grid { min-height: 635px; display: grid; grid-template-columns: minmax(0,1.08fr) minmax(0,.92fr); gap: clamp(24px,4vw,55px); align-items: center; padding-top: 53px; padding-bottom: 64px; }
.king-hero-copy { position: relative; z-index: 4; max-width: 670px; animation: king-entrance .9s var(--king-ease) both; }
.king-hero h1 { margin: 0; color: #fff; font-weight: 740; font-size: clamp(63px,6.3vw,97px); line-height: .99; letter-spacing: -.078em; }
.king-hero h1 .king-italic { color: #eed29b; white-space: nowrap; }
.king-hero-lead { max-width: 485px; margin: 30px 0 33px; color: #ddd4e8; font-size: 16px; line-height: 1.78; }
.king-hero-search { position: relative; display: flex; align-items: center; gap: 11px; min-height: 75px; width: min(100%,680px); padding: 8px 9px 8px 19px; background: #fff; border: 1px solid rgba(255,255,255,.95); border-radius: 16px; box-shadow: 0 17px 48px rgba(16,9,28,.28); }
.king-hero-search:focus-within { box-shadow: 0 18px 51px rgba(16,9,28,.3),0 0 0 4px rgba(234,205,147,.24); }
.king-magnifier svg { display: block; width: 22px; height: 22px; fill: none; stroke: #716487; stroke-width: 1.8; stroke-linecap: round; }
.king-hero-search input { width: 100%; flex: 1 1 auto; min-width: 70px; padding: 10px 2px; border: 0; outline: none; color: #30263e; background: transparent; font-size: 14px; }
.king-hero-search input::placeholder { color: #91869e; }
.king-hero-search select { flex: 0 0 auto; max-width: 100px; background: #f8f5fb; border: 1px solid #ede8f2; border-radius: 8px; color: #4c4260; padding: 10px 8px; font-size: 11px; font-weight: 750; }
.king-search-submit { display: inline-flex; align-items: center; justify-content: center; gap: 19px; flex: 0 0 auto; align-self: stretch; min-height: 55px; padding: 0 18px; border: 0; border-radius: 10px; color: #251b34; background: #e8c279; cursor: pointer; font: inherit; font-weight: 850; font-size: 13px; transition: transform .22s var(--king-ease),background .22s ease; }
.king-search-submit:hover { background: #f4d79e; transform: translateY(-2px); }
.king-search-submit:disabled { opacity: .72; cursor: progress; }
.king-hero-foot { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px 14px; max-width: 650px; margin-top: 22px; }
.king-hero-foot a { color: #f4dbab; font-size: 13px; font-weight: 780; }
.king-hero-foot a:hover { color: #fff; }
.king-hero-caption { color: #b9aacb; font-size: 10px; }
.king-hero-art { --px: 0deg; --py: 0deg; position: relative; width: 100%; max-width: 540px; margin-inline: auto; aspect-ratio: 1 / 1.12; min-height: 470px; perspective: 1150px; transform-style: preserve-3d; animation: king-art-in 1.1s var(--king-ease) .14s both; }
.king-art-halo { position: absolute; inset: 3% -5% 4%; z-index: -1; border: 1px solid rgba(236,198,127,.22); border-radius: 48% 52% 41% 59%; box-shadow: 0 0 0 29px rgba(255,255,255,.018),0 0 0 72px rgba(246,227,181,.024); transform: rotate(-18deg); }
.king-photo-frame { position: absolute; inset: 3% 4% 9% 14%; overflow: hidden; border: 7px solid rgba(255,255,255,.14); border-radius: 47% 47% 34% 34% / 41% 43% 24% 25%; transform: rotate(5deg); box-shadow: 0 30px 100px rgba(13,5,25,.38); background: linear-gradient(145deg,#a98ace,#e1bba5); }
.king-photo-frame::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg,transparent 55%,rgba(34,17,52,.28)),linear-gradient(70deg,rgba(68,42,96,.16),transparent); pointer-events: none; }
.king-photo-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 44% 48%; transform: scale(1.15) rotate(-5deg); filter: saturate(.88) contrast(1.035); }
.king-3d-card { position: absolute; z-index: 3; left: -6%; right: 17%; bottom: 12%; padding: 21px 24px 19px; color: #362847; border: 1px solid rgba(255,255,255,.87); border-radius: 18px; background: linear-gradient(130deg,rgba(255,255,255,.98),rgba(246,239,253,.94)); box-shadow: 0 23px 50px rgba(12,6,27,.3), inset 0 1px 0 #fff; transform: rotateY(-13deg) rotateX(6deg) rotate(-6deg); transform-style: preserve-3d; animation: king-float-card 8s ease-in-out infinite; }
.king-card-top,.king-card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.king-card-top { font-size: 10px; color: #8b8297; letter-spacing: .12em; font-weight: 800; }
.king-card-icon { display: grid; place-items: center; width: 27px; height: 27px; color: #fff; background: #6749d6; border-radius: 8px; font-size: 21px; }
.king-card-domain { margin: 22px 0 20px; font-weight: 850; font-size: clamp(27px,2.8vw,41px); white-space: nowrap; letter-spacing: -.06em; }
.king-card-domain span { color: #9470bd; }
.king-card-bottom { border-top: 1px solid #e8e2ef; padding-top: 16px; color: #796e88; font-size: 10px; font-weight: 750; }
.king-card-bottom > span:last-child { color: #6945bd; }
.king-card-bottom i { display: inline-block; width: 7px; height: 7px; margin-right: 6px; background: #d8ae58; border-radius: 50%; }
.king-floating-pill { position: absolute; z-index: 4; top: 9%; right: -3%; padding: 12px 19px; color: #3e304f; background: #fff; border-radius: 30px; font-size: 13px; font-weight: 850; box-shadow: 0 17px 40px rgba(19,8,38,.22); animation: king-slow-float 7s ease-in-out infinite; }
.king-floating-pill span { color: #ad7f31; margin-right: 5px; }
.king-spark { position: absolute; color: #edcc94; text-shadow: 0 5px 28px #e8c27966; }
.king-spark-a { top: 15%; left: 6%; font-size: 47px; animation: king-twinkle 6s ease-in-out infinite; }
.king-spark-b { top: 46%; right: -3%; font-size: 55px; animation: king-twinkle 7s ease-in-out -2s infinite; }
.king-hero-strip { position: relative; z-index: 3; display: flex; align-items: center; gap: 23px; padding-bottom: 25px; color: #bfb1d4; font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.king-strip-line { flex: 1 1 auto; height: 1px; background: rgba(255,255,255,.18); }
.king-hero-strip a { color: #e9d4ae; white-space: nowrap; }
/* Section system */
.king-services,.king-featured,.king-extensions,.king-process,.king-service-content { padding: 105px 0; }
.king-services { background: #faf8f5; }
.king-section-header,.king-featured-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 35px; margin-bottom: 40px; }
.king-section-header h2,.king-featured-top h2,.king-story h2,.king-process h2,.king-service-content h2 { margin: 0; color: #261b37; font-size: clamp(37px,4.3vw,61px); line-height: 1.11; letter-spacing: -.064em; font-weight: 760; }
.king-section-header em,.king-featured em,.king-story em,.king-process em,.king-service-content em { color: #9b7439; }
.king-section-header > p,.king-featured-top > p { max-width: 320px; color: #746c7b; font-size: 14px; line-height: 1.8; }
.king-service-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.king-service-card { position: relative; display: flex; min-height: 360px; flex-direction: column; justify-content: space-between; padding: 25px 23px; overflow: hidden; isolation: isolate; border: 1px solid rgba(34,22,54,.06); border-radius: 18px; transition: transform .45s var(--king-ease), box-shadow .45s var(--king-ease); }
.king-service-card:hover { transform: translateY(-9px); box-shadow: 0 23px 48px rgba(31,20,50,.15); }
.king-service-no { position: relative; z-index: 2; font-size: 10px; font-weight: 900; letter-spacing: .12em; }
.king-service-card-foot { position: relative; z-index: 2; display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; }
.king-service-card h3 { margin: 0 0 10px; font-size: clamp(20px,1.75vw,25px); font-weight: 780; line-height: 1.17; letter-spacing: -.04em; }
.king-service-card p { max-width: 190px; margin: 0; font-size: 11px; line-height: 1.6; }
.king-circle-arrow { display: grid; width: 39px; height: 39px; flex: none; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: 21px; transition: transform .3s var(--king-ease); }
.king-service-card:hover .king-circle-arrow { transform: rotate(45deg); }
.king-service-card-domains { background: #332448; color: #fff; }
.king-service-card-domains:hover { color: #fff; }
.king-service-card-domains p { color: #d8cfe2; }
.king-service-symbol { font-size: clamp(70px,6.5vw,113px); font-weight: 850; letter-spacing: -.11em; line-height: 1; color: #f0d49d; transform: rotate(-11deg) translateX(-4px); text-shadow: 10px 15px 0 #9874cf,18px 25px 28px rgba(7,1,16,.4); }
.king-service-card-hosting { background: #e9e0f8; color: #3b275e; }
.king-service-card-hosting:hover { color: #3b275e; }
.king-server-art { margin: 11px auto 2px; width: 144px; height: 125px; transform: rotate(-10deg) skewY(5deg); filter: drop-shadow(15px 17px 10px rgba(69,32,131,.15)); }
.king-server-art span { position: relative; display: block; height: 34px; margin-bottom: 5px; border: 2px solid #6f4ab3; border-radius: 7px; background: linear-gradient(120deg,#8666c7,#50317f); box-shadow: inset 0 3px 0 rgba(255,255,255,.22),5px 4px 0 #d1baf0; }
.king-server-art span::before { position: absolute; content: ""; top: 12px; left: 15px; width: 5px; height: 5px; background: #f3dc9b; border-radius: 50%; box-shadow: 12px 0 0 #f3dc9b; }
.king-service-card-email { background: #f6dfb3; color: #4a352c; }
.king-service-card-email:hover { color: #4a352c; }
.king-mail-art { display: grid; place-items: center; width: 130px; height: 124px; margin: 0 auto; border: 2px solid #9d723b; border-radius: 26px; background: #ffe9bf; box-shadow: 12px 13px 0 #bc914b,16px 20px 26px rgba(116,76,33,.12); transform: rotate(-9deg); }
.king-mail-art span { font-family: Georgia,serif; font-weight: bold; font-size: 96px; line-height: 1; }
.king-service-card-builder { background: #dce6e4; color: #234541; }
.king-service-card-builder:hover { color: #234541; }
.king-builder-art { width: 150px; height: 135px; margin: 0 auto; padding: 13px; border: 5px solid #336964; border-radius: 12px; background: #f8fffb; transform: rotate(8deg); box-shadow: 11px 13px 0 #a9c9c2,16px 19px 24px rgba(16,70,63,.1); }
.king-builder-dots { color: #58938b; font-size: 11px; letter-spacing: 2px; }
.king-builder-banner { height: 39px; margin: 7px 0; background: linear-gradient(110deg,#3c8980,#a4d7bf); border-radius: 5px; }
.king-builder-lines { display: grid; gap: 6px; }
.king-builder-lines span { height: 8px; width: 95%; background: #e2eae9; border-radius: 20px; }
.king-builder-lines span:last-child { width: 57%; }
/* Featured names */
.king-featured { background: #fff; }
.king-featured-top { margin-bottom: 12px; }
.king-inline-link { display: inline-flex; align-items: center; gap: 14px; padding-bottom: 7px; border-bottom: 1px solid #b99e6c; color: #4a325f; font-weight: 800; font-size: 13px; white-space: nowrap; transition: gap .2s ease; }
.king-inline-link:hover { gap: 22px; color: #7654ba; }
.king-data-note { margin: 0 0 30px; color: #807788; font-size: 12px; }
.king-featured-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 19px; }
.king-domain-card { position: relative; min-height: 250px; display: flex; flex-direction: column; justify-content: space-between; padding: 26px; overflow: hidden; border: 1px solid #e7e0eb; border-radius: 18px; background: linear-gradient(145deg,#fff,#faf7fd); transform-style: preserve-3d; transition: transform .35s var(--king-ease),box-shadow .35s var(--king-ease),border-color .35s ease; }
.king-domain-card:hover { transform: translateY(-7px); border-color: #d0bee8; box-shadow: 0 22px 40px rgba(42,24,67,.12); }
.king-domain-card:before { position: absolute; right: -33px; top: -54px; width: 150px; height: 150px; content: ""; border-radius: 50%; border: 1px solid rgba(137,96,180,.12); box-shadow: 0 0 0 22px rgba(145,115,180,.045),0 0 0 45px rgba(145,115,180,.025); }
.king-domain-overline { display: flex; align-items: center; justify-content: space-between; color: #9a8ba7; font-size: 10px; letter-spacing: .13em; font-weight: 850; }
.king-domain-ext { padding: 6px 10px; color: #624a96; background: #f0eafb; border-radius: 7px; font-size: 11px; letter-spacing: 0; }
.king-domain-card h3 { margin: 30px 0; overflow-wrap: anywhere; font-size: clamp(23px,2.4vw,32px); line-height: 1.12; letter-spacing: -.055em; }
.king-domain-card h3 a:hover { color: #6749d6; }
.king-domain-line { height: 1px; background: #e9e2ee; }
.king-domain-bottom { display: flex; align-items: end; justify-content: space-between; margin-top: 20px; }
.king-domain-bottom > div { display: grid; gap: 5px; }
.king-domain-bottom small { color: #81758f; font-size: 10px; }
.king-domain-bottom strong { color: #281d39; font-size: 22px; letter-spacing: -.04em; }
.king-domain-arrow { display: grid; width: 43px; height: 43px; place-items: center; background: #2d213f; color: #fff; font-size: 22px; border-radius: 50%; }
.king-domain-arrow:hover { color: #fff; background: #6749d6; }
/* Story */
.king-story { background: #f8f4ef; padding: 107px 0; }
.king-story-inner { display: grid; grid-template-columns: 1fr .83fr; align-items: center; gap: clamp(55px,8vw,120px); }
.king-story-photo { position: relative; max-height: 510px; aspect-ratio: 1.16; border-radius: 20px 130px 20px 20px; }
.king-story-photo img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; filter: saturate(.8); }
.king-story-sticker { position: absolute; right: -26px; bottom: 30px; display: flex; align-items: center; gap: 25px; padding: 15px 18px; color: #2e2140; background: #eac887; font-size: 12px; font-weight: 850; letter-spacing: .06em; border-radius: 5px 15px 5px 15px; transform: rotate(-5deg); box-shadow: 0 14px 22px rgba(71,48,30,.14); }
.king-story-sticker span { font-size: 24px; }
.king-story h2 { max-width: 510px; }
.king-story-copy > p:not(.king-kicker) { max-width: 450px; margin: 27px 0; color: #6d6573; font-size: 15px; line-height: 1.9; }
.king-story-detail { display: flex; gap: 17px; align-items: flex-start; max-width: 450px; margin-top: 45px; padding-top: 20px; border-top: 1px solid #ded5c9; color: #797080; font-size: 12px; line-height: 1.8; }
.king-story-detail > span:first-child { font-size: 25px; color: #ae8747; line-height: 1; }
/* Extensions */
.king-extensions { background: #fff; }
.king-extension-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; margin-top: 38px; }
.king-extension-tile { position: relative; min-height: 145px; display: flex; flex-direction: column; justify-content: space-between; padding: 23px 25px; border: 1px solid #e9e3ec; border-radius: 15px; background: #fbf9fd; transition: transform .25s var(--king-ease),border-color .25s ease,box-shadow .25s ease; }
.king-extension-tile:hover { transform: translateY(-5px); border-color: #cfbfe4; box-shadow: 0 15px 28px rgba(45,30,72,.09); }
.king-extension-tile > span { color: #342448; font-size: 36px; letter-spacing: -.06em; font-weight: 820; }
.king-extension-tile small { color: #84798e; font-size: 12px; }
.king-extension-tile b { position: absolute; top: 22px; right: 23px; color: #9f7c40; font-weight: 600; font-size: 22px; }
.king-process { background: #f8f5ef; }
.king-process-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 30px; }
.king-process-step { padding-top: 20px; border-top: 1px solid #d9cdbd; }
.king-process-step > span { color: #b48a48; font-family: Georgia,serif; font-size: 38px; font-style: italic; }
.king-process-step h3 { margin: 20px 0 8px; color: #2c203f; font-size: 22px; }
.king-process-step p { max-width: 300px; margin: 0; color: #786d7a; font-size: 14px; line-height: 1.8; }
/* CTA & footer */
.king-final-cta { padding: 82px 0 96px; background: #fff; }
.king-final-inner { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 25px; overflow: hidden; padding: 65px 70px; background: linear-gradient(113deg,#24192f,#533a7e); border-radius: 24px; color: #fff; }
.king-final-inner h2 { position: relative; z-index: 1; margin: 0; font-size: clamp(37px,4.4vw,57px); line-height: 1.1; letter-spacing: -.06em; }
.king-final-inner .king-kicker { color: #eed4a1; }
.king-final-star { position: absolute; bottom: -160px; right: 16%; color: rgba(237,211,164,.085); font-size: 350px; line-height: 1; }
.king-gold-button { position: relative; z-index: 2; border-color: #e8c279; background: #e8c279; color: #251a35; border-radius: 50px; white-space: nowrap; box-shadow: 0 8px 24px rgba(10,5,22,.14); }
.king-gold-button:hover { color: #251a35; background: #f3d59b; box-shadow: 0 15px 27px rgba(10,5,22,.19); }
.king-footer { border: 0; color: #d4c9dc; background: #1d172b; }
.king-footer-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; padding-top: 78px; padding-bottom: 65px; border-bottom: 1px solid rgba(255,255,255,.12); }
.king-footer-top h2 { margin: 0; color: #fff; font-size: clamp(34px,3.6vw,52px); letter-spacing: -.055em; line-height: 1.1; }
.king-footer-top .eyebrow { color: #dbbd89; }
.king-footer-top em { color: #e8c279; }
.king-footer .footer-main { padding-top: 60px; padding-bottom: 55px; gap: 30px; }
.king-footer .wordmark { color: #fff; }
.king-footer .wordmark-king { color: #f0d6a8; }
.king-footer .footer-brand > p,.king-footer .footer-note p { color: #a99db7; font-size: 12px; line-height: 1.85; }
.king-footer .footer-links h2,.king-footer .footer-note h2 { color: #fff; }
.king-footer .footer-links a { color: #bdb1cd; }
.king-footer .footer-links a:hover { color: #e8c279; }
.king-footer .footer-bottom { color: #968aa7; border-top: 1px solid rgba(255,255,255,.12); }
/* Planned product pages */
.king-service-hero { position: relative; overflow: hidden; background: radial-gradient(circle at 76% 42%,#63448c,#2b1f40 58%,#21182f); color: #fff; }
.king-service-hero-layout { min-height: 560px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 60px; padding-top: 90px; padding-bottom: 95px; }
.king-status-label { display: inline-block; margin-bottom: 24px; padding: 8px 12px; border: 1px solid rgba(234,202,142,.34); border-radius: 30px; color: #ebd8b1; font-size: 10px; letter-spacing: .09em; font-weight: 850; }
.king-service-hero h1 { margin: 0; max-width: 630px; font-size: clamp(48px,5.3vw,72px); letter-spacing: -.07em; line-height: 1.05; }
.king-service-hero h1 em { color: #e8c279; }
.king-service-hero-text > p:not(.king-tag) { max-width: 550px; color: #d7cde3; font-size: 16px; line-height: 1.8; margin: 25px 0; }
.king-service-buttons { display: flex; align-items: center; gap: 23px; flex-wrap: wrap; }
.king-white-link { color: #f0dcba; font-size: 12px; font-weight: 750; }
.king-white-link:hover { color: #fff; }
.king-service-art { --px: 0deg; --py: 0deg; position: relative; width: min(90%,400px); aspect-ratio: 1; margin-inline: auto; perspective: 1000px; }
.king-service-art-back { position: absolute; inset: 8%; background: #775ac0; border-radius: 30%; transform: rotate(20deg); box-shadow: 0 0 0 18px rgba(236,208,155,.08),0 0 0 55px rgba(236,208,155,.03); }
.king-service-art-front { position: absolute; inset: 12% 8%; padding: 26px; border: 2px solid rgba(255,255,255,.7); border-radius: 22px; background: linear-gradient(150deg,#f9f7fc,#daccf0); box-shadow: 26px 35px 55px rgba(12,5,25,.4); transform: rotateY(-13deg) rotateX(8deg) rotate(-9deg); animation: king-float-card 8s ease-in-out infinite; }
.king-art-header { display: flex; justify-content: space-between; color: #5c417c; font-size: 10px; font-weight: 850; letter-spacing: .12em; }
.king-art-glyph { display: grid; height: 65%; place-items: center; color: #6749d6; font-size: clamp(100px,14vw,190px); font-family: Georgia,serif; font-weight: bold; line-height: 1; text-shadow: 7px 12px 0 #c4b0e7; }
.king-art-description { color: #342548; font-weight: 850; font-size: 18px; }
.king-art-bars { display: flex; gap: 6px; margin-top: 12px; }
.king-art-bars span { height: 6px; width: 60px; border-radius: 10px; background: #baa5d8; }
.king-art-bars span:nth-child(2) { width: 29px; background: #d6b576; }
.king-art-bars span:nth-child(3) { width: 19px; }
.king-service-art-badge { position: absolute; right: -7%; bottom: 6%; padding: 12px 14px; border-radius: 30px; color: #2c1f42; background: #efcd90; box-shadow: 0 14px 28px rgba(0,0,0,.18); font-size: 10px; font-weight: 900; transform: rotate(7deg); }
.king-service-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.king-service-detail { min-height: 225px; padding: 30px; background: #fff; border: 1px solid #e7e0ed; border-radius: 17px; box-shadow: 0 12px 28px rgba(37,22,58,.05); }
.king-detail-star { color: #a27b41; font-size: 32px; }
.king-service-detail h3 { margin: 20px 0 12px; color: #2e213e; font-size: 21px; }
.king-service-detail p { margin: 0; color: #746a7e; line-height: 1.8; font-size: 13px; }
.king-service-next { padding: 10px 0 95px; background: #fff; }
.king-next-box { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 36px 45px; border-radius: 20px; color: #fff; background: #302345; }
.king-next-box h2 { margin: 0; font-size: 32px; letter-spacing: -.05em; }
.king-next-box p:not(.king-kicker) { color: #c9bcd7; margin: 11px 0 0; font-size: 13px; }
/* Motion */
@keyframes king-entrance { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes king-art-in { from { opacity: 0; transform: translateX(35px) scale(.94); } to { opacity: 1; transform: translateX(0) scale(1); } }
@keyframes king-float-card { 0%,100% { translate: 0 0; } 50% { translate: 0 -15px; } }
@keyframes king-slow-float { 0%,100% { transform: translateY(0) rotate(6deg); } 50% { transform: translateY(-14px) rotate(1deg); } }
@keyframes king-twinkle { 0%,100% { opacity: .7; transform: scale(.85) rotate(-8deg); } 50% { opacity: 1; transform: scale(1.12) rotate(12deg); } }
@media (max-width: 1080px) {
  .primary-nav { gap: 11px; }
  .nav-link { font-size: 11px; }
  .header-inner { min-height: 75px; }
  .king-hero-grid { gap: 10px; }
  .king-hero h1 { font-size: clamp(58px,6.6vw,82px); }
  .king-service-card { min-height: 335px; padding: 20px 17px; }
}
@media (max-width: 850px) {
  .king-hero-grid { grid-template-columns: 1fr 1fr; min-height: 515px; gap: 7px; }
  .king-hero h1 { font-size: clamp(51px,6.7vw,65px); }
  .king-hero-lead { font-size: 14px; margin: 23px 0; }
  .king-hero-art { min-height: 300px; }
  .king-3d-card { left: -9%; right: 4%; bottom: 9%; padding: 15px; }
  .king-card-domain { font-size: 24px; margin: 12px 0; }
  .king-floating-pill { font-size: 10px; }
  .king-service-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .king-service-card { min-height: 310px; }
  .king-featured-grid { gap: 12px; }
  .king-domain-card { padding: 18px; }
  .king-domain-card h3 { font-size: 22px; }
  .king-story-inner { gap: 37px; }
}
@media (max-width: 760px) {
  .announcement-inner { min-height: 35px; }
  .announcement-inner > span { display: none; }
  .site-header { z-index: 30; }
  .header-inner { min-height: 71px; }
  .menu-toggle { border-radius: 10px; }
  .primary-nav { top: 70px; gap: 0; }
  .primary-nav .nav-link { font-size: 14px; }
  .king-hero-grid { grid-template-columns: 1fr; padding-top: 53px; padding-bottom: 15px; }
  .king-hero-copy { max-width: 620px; }
  .king-hero h1 { font-size: clamp(54px,10vw,79px); }
  .king-hero-art { width: min(86%,490px); min-height: 0; aspect-ratio: 1 / 1; margin-top: 0; }
  .king-photo-frame { inset: 3% 6% 6% 14%; }
  .king-3d-card { bottom: 10%; right: 14%; }
  .king-hero-strip { margin-top: 20px; }
  .king-services,.king-featured,.king-extensions,.king-process,.king-service-content { padding: 75px 0; }
  .king-section-header,.king-featured-top { align-items: flex-start; flex-direction: column; gap: 8px; }
  .king-section-header > p,.king-featured-top > p { max-width: 580px; }
  .king-featured-grid { grid-template-columns: 1fr; }
  .king-domain-card { min-height: 210px; }
  .king-domain-card h3 { margin: 25px 0; font-size: 30px; }
  .king-story-inner { grid-template-columns: 1fr; }
  .king-story-photo { max-height: 400px; }
  .king-story-copy h2 { max-width: 620px; }
  .king-process-grid { gap: 15px; }
  .king-final-inner { padding: 45px 38px; }
  .king-footer-top { padding-top: 55px; padding-bottom: 45px; }
  .king-service-hero-layout { grid-template-columns: 1fr; gap: 10px; padding-top: 70px; }
  .king-service-art { width: min(65%,360px); }
  .king-service-detail-grid { gap: 12px; }
  .king-service-detail { padding: 19px; }
}
@media (max-width: 540px) {
  .container { width: min(calc(100% - 32px),var(--container)); }
  .king-tag { gap: 8px; font-size: 9px; letter-spacing: .13em; }
  .king-hero h1 { font-size: clamp(48px,12vw,64px); }
  .king-hero-lead { font-size: 13px; line-height: 1.8; margin: 21px 0; }
  .king-hero-search { min-height: 61px; padding: 6px; gap: 3px; border-radius: 11px; }
  .king-hero-search input { font-size: 11px; }
  .king-hero-search select { max-width: 66px; padding: 9px 1px; font-size: 10px; }
  .king-magnifier { display: none; }
  .king-search-submit { padding: 0 11px; min-height: 48px; font-size: 11px; gap: 4px; }
  .king-hero-caption { font-size: 9px; }
  .king-hero-art { width: 93%; }
  .king-3d-card { left: -3%; right: 11%; }
  .king-card-domain { font-size: clamp(22px,7vw,29px); }
  .king-hero-strip { gap: 11px; font-size: 8px; }
  .king-hero-strip > span:first-child { display: none; }
  .king-service-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .king-service-card { min-height: 295px; padding: 17px 14px; }
  .king-service-no { font-size: 9px; }
  .king-service-card h3 { font-size: 18px; }
  .king-service-card p { font-size: 10px; }
  .king-service-symbol { font-size: clamp(61px,17vw,95px); }
  .king-server-art { transform: scale(.75) rotate(-10deg); }
  .king-mail-art { transform: scale(.7) rotate(-9deg); }
  .king-builder-art { transform: scale(.75) rotate(8deg); }
  .king-circle-arrow { width: 29px; height: 29px; font-size: 16px; }
  .king-section-header h2,.king-featured-top h2,.king-story h2,.king-process h2,.king-service-content h2 { font-size: clamp(33px,9vw,47px); }
  .king-story-sticker { right: -6px; font-size: 10px; }
  .king-extension-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .king-extension-tile { min-height: 123px; padding: 17px; }
  .king-extension-tile > span { font-size: 29px; }
  .king-process-grid,.king-service-detail-grid { grid-template-columns: 1fr; gap: 22px; }
  .king-final-inner,.king-footer-top,.king-next-box { flex-direction: column; align-items: flex-start; }
  .king-final-inner { padding: 40px 25px; }
  .king-footer .footer-main { grid-template-columns: 1fr 1fr; }
  .king-footer .footer-brand,.king-footer .footer-note { grid-column: 1 / -1; }
  .king-footer-top { align-items: flex-start; }
  .king-service-hero h1 { font-size: clamp(44px,11vw,62px); }
  .king-service-art { width: min(82%,330px); }
  .king-next-box { padding: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .king-hero-copy,.king-hero-art,.king-3d-card,.king-service-art-front,.king-floating-pill,.king-spark { animation: none !important; }
  .king-service-card,.king-domain-card,.king-extension-tile,.king-circle-arrow,.brand-symbol { transition: none !important; }
  .king-service-card:hover,.king-domain-card:hover,.king-extension-tile:hover { transform: none; }
}
/* Four-link footer and tablet navigation refinements. */
.king-footer .footer-main { grid-template-columns: 1.25fr .65fr .65fr 1fr; gap: 30px; }
.king-hero-art,.king-service-art { transition: transform .5s var(--king-ease); }
@media (max-width: 1040px) and (min-width: 761px) {
  .menu-toggle { display: flex; width: 42px; height: 42px; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 0; background: #f5f0fa; border: 1px solid #e3dbe9; border-radius: 10px; cursor: pointer; }
  .menu-toggle > span:not(.sr-only) { display: block; width: 17px; height: 2px; background: var(--navy); border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }
  .menu-toggle[aria-expanded="true"] > span:nth-last-child(3) { transform: translateY(7px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] > span:nth-last-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] > span:nth-last-child(1) { transform: translateY(-7px) rotate(-45deg); }
  .primary-nav { position: absolute; top: calc(100% - 1px); left: 0; right: 0; display: none; align-items: stretch; flex-direction: column; gap: 0; padding: 10px 18px 18px; background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 15px 25px rgba(20, 41, 74, .09); }
  .primary-nav.is-open { display: flex; }
  .primary-nav .nav-link { padding: 12px 4px; border-bottom: 1px solid #f0f2f6; font-size: 14px; }
  .primary-nav .button { margin-top: 13px; }
  .primary-nav .nav-auth-form { margin-top: 10px; }
}
@media (max-width: 760px) {
  .king-footer .footer-main { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .king-footer .footer-brand,.king-footer .footer-note { grid-column: 1 / -1; }
}
/* Small page-entry transition rather than scroll hijacking. */
main { animation: king-page-in .38s ease-out both; }
@keyframes king-page-in { from { opacity: .88; translate: 0 7px; } to { opacity: 1; translate: 0 0; } }
@media (prefers-reduced-motion: reduce) { main { animation: none; } }