/* ==========================================================================
   أبيات العشب - الأنماط الموحدة الكاملة للموقع (النسخة المدمجة والمحسنة)
   Abyat Al-Oshb Unified Stylesheet - Merged Classes & IDs
   Classes and IDs with identical style blocks merged outside & inside @media
   ========================================================================== */

/* ==========================================================================
   1. TOP-LEVEL RULES (MERGED OUTSIDE MEDIA QUERIES)
   Combined identical declaration blocks into comma-separated selectors.
   ========================================================================== */

@font-face {
    font-family: "Cairo";
    src: url("../fonts/Cairo-VariableFont_slnt,wght.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
}

:root {
    --bs-font-sans-serif: "Cairo", system-ui, sans-serif;
    --bs-body-font-family: var(--bs-font-sans-serif);
    --g9: #12392b;
    --g7: #1f6b4a;
    --g5: #3f9a63;
    --lime: #b7e35a;
    --paper: #f6faf4;
    --ink: #17261f;
    --mute: #5d6f65;
    --chip: #eef1ee;
    --line: #e1e8e2;
    --g9-rgb: 18, 57, 43;
    --leaf: #6fcf8a;
    --leaf-soft: #d8efc4;
    --star: #ffc83d;
    --c1: var(--g7);
    --c2: #008c1a;
    --c3: #9a5f10;
    --glass: rgba(var(--g9-rgb), 0.35);
    --glassTxt: #fff;
    box-sizing: border-box;
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

html {
    height: 100%;
    scroll-padding-top: 96px;
    -webkit-text-size-adjust: 100%;
}

@media (max-width: 640px) {
    html {
        font-size: 87.5%;
    }
}

.abyat-sr-only,
.abt-sr-only,
.svcl-sr-only,
.svcp-sr-only,
.gal-sr-only,
.city-sr-only,
.catl-sr-only,
.catp-sr-only,
.artl-sr-only,
.artp-sr-only,
.ctc-sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.abyat-skip,
.abt-skip,
.svcl-skip,
.svcp-skip,
.gal-skip,
.city-skip,
.catl-skip,
.catp-skip,
.artl-skip,
.artp-skip,
.ctc-skip {
    position: fixed;
    top: 8px;
    inset-inline-start: 8px;
    z-index: 100;
    padding: 0.7rem 1.1rem;
    border-radius: 12px;
    background: var(--lime);
    color: var(--g9);
    font-weight: 800;
    transform: translateY(-220%);
}

.abyat-skip:focus,
.abt-skip:focus,
.svcl-skip:focus,
.svcp-skip:focus,
.gal-skip:focus,
.city-skip:focus,
.catl-skip:focus,
.catp-skip:focus,
.artl-skip:focus,
.artp-skip:focus,
.ctc-skip:focus {
    transform: none;
}

main:focus,
.abyat-art .abyat-more:focus-visible,
.abt-art .abt-more:focus-visible,
.svcl-art .svcl-more:focus-visible,
.svcp-art .svcp-more:focus-visible,
.gal-art .gal-more:focus-visible,
.city-art .city-more:focus-visible,
.catl-art .catl-more:focus-visible,
.catp-art .catp-more:focus-visible,
.artl-art .artl-more:focus-visible,
.artp-art .artp-more:focus-visible,
.ctc-art .ctc-more:focus-visible {
    outline: none;
}

body {
    margin: 0;
    font-family: "Cairo", system-ui, sans-serif;
    background: var(--paper);
    color: var(--ink);
    padding-top: env(safe-area-inset-top, 0px);
}

a {
    text-decoration: none;
    color: inherit;
}

svg.abyat-icon,
svg.abt-i,
svg.svcl-i,
svg.svcp-i,
svg.gal-i,
svg.city-i,
svg.catl-i,
svg.catp-i,
svg.artl-i,
svg.artp-i,
svg.ctc-i {
    width: 1.1em;
    height: 1.1em;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex: none;
}

svg.abyat-icon-fill,
svg.abt-f,
svg.svcl-f,
svg.svcp-f,
svg.gal-f,
svg.city-f,
svg.catl-f,
svg.catp-f,
svg.artl-f,
svg.artp-f,
svg.ctc-f {
    fill: currentColor;
    stroke: none;
}

.abyat-hero,
.abt-hero,
.svcl-hero,
.svcp-hero,
.gal-hero,
.city-hero,
.catl-hero,
.catp-hero,
.artl-hero,
.artp-hero,
.ctc-hero {
    position: relative;
    min-height: 100svh;
    color: #fff;
    overflow: hidden;
    background: var(--g9);
    display: flex;
    align-items: center;
}

.abyat-bg,
.abt-bg,
.svcl-bg,
.svcp-bg,
.gal-bg,
.city-bg,
.catl-bg,
.catp-bg,
.artl-bg,
.artp-bg,
.ctc-bg {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.35s;
}

.abyat-bg.abyat-on,
.abt-bg.abt-on,
.svcl-bg.svcl-on,
.svcp-bg.svcp-on,
.gal-bg.gal-on,
.city-bg.city-on,
.catl-bg.catl-on,
.catp-bg.catp-on,
.artl-bg.artl-on,
.artp-bg.artp-on,
.ctc-bg.ctc-on {
    opacity: 1;
    transition: opacity 0.9s;
}

.abyat-bg::after,
.abt-bg::after,
.svcl-bg::after,
.svcp-bg::after,
.gal-bg::after,
.city-bg::after,
.catl-bg::after,
.catp-bg::after,
.artl-bg::after,
.artp-bg::after,
.ctc-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #00000063;
}

.abyat-b1,
.abt-b1,
.svcl-b1,
.svcp-b1,
.gal-b1,
.city-b1,
.catl-b1,
.catp-b1,
.artl-b1,
.artp-b1,
.ctc-b1 {
    background:
        radial-gradient(60% 50% at 25% 70%, var(--g5), transparent),
        linear-gradient(160deg, var(--g9), var(--g7) 60%, var(--g5));
}

.abyat-b2,
.abt-b2,
.svcl-b2,
.svcp-b2,
.gal-b2,
.city-b2,
.catl-b2,
.catp-b2,
.artl-b2,
.artp-b2,
.ctc-b2 {
    background:
        radial-gradient(50% 50% at 30% 30%, var(--lime), transparent),
        linear-gradient(200deg, var(--g9), var(--g7));
}

.abyat-b3,
.abt-b3,
.svcl-b3,
.svcp-b3,
.gal-b3,
.city-b3,
.catl-b3,
.catp-b3,
.artl-b3,
.artp-b3,
.ctc-b3 {
    background:
        radial-gradient(55% 55% at 20% 80%, var(--leaf), transparent),
        linear-gradient(150deg, var(--g9), var(--g7) 70%);
}

.abyat-b4,
.abt-b4,
.svcl-b4,
.svcp-b4,
.gal-b4,
.city-b4,
.catl-b4,
.catp-b4,
.artl-b4,
.artp-b4,
.ctc-b4 {
    background:
        radial-gradient(55% 50% at 30% 60%, var(--lime), transparent),
        linear-gradient(170deg, var(--g9), var(--g5));
}

.abyat-leaves,
.abt-leaves,
.svcl-leaves,
.svcp-leaves,
.gal-leaves,
.city-leaves,
.catl-leaves,
.catp-leaves,
.artl-leaves,
.artp-leaves,
.ctc-leaves {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}

.abyat-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: abyat-kf-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.abyat-leaf svg,
.abt-leaf svg,
.svcl-leaf svg,
.svcp-leaf svg,
.gal-leaf svg,
.city-leaf svg,
.catl-leaf svg,
.catp-leaf svg,
.artl-leaf svg,
.artp-leaf svg,
.ctc-leaf svg {
    width: var(--s);
    height: var(--s);
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
    display: block;
}

.abyat-wrap,
.abt-wrap,
.svcl-wrap,
.svcp-wrap,
.gal-wrap,
.city-wrap,
.catl-wrap,
.catp-wrap,
.artl-wrap,
.artp-wrap,
.ctc-wrap {
    position: relative;
    z-index: 2;
    width: min(1350px, calc(100% - 24px));
    margin: 0 auto;
    padding: 130px 24px;
}

.abyat-txts,
.abt-txts,
.svcl-txts,
.svcp-txts,
.gal-txts,
.city-txts,
.catl-txts,
.catp-txts,
.artl-txts,
.artp-txts,
.ctc-txts {
    display: grid;
    max-width: 660px;
}

.abyat-tx,
.abt-tx,
.svcl-tx,
.svcp-tx,
.gal-tx,
.city-tx,
.catl-tx,
.catp-tx,
.artl-tx,
.artp-tx,
.ctc-tx {
    grid-area: 1/1;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition:
        opacity 0.3s,
        transform 0.3s,
        visibility 0s 0.3s;
}

.abyat-tx.abyat-on,
.abt-tx.abt-on,
.svcl-tx.svcl-on,
.svcp-tx.svcp-on,
.gal-tx.gal-on,
.city-tx.city-on,
.catl-tx.catl-on,
.catp-tx.catp-on,
.artl-tx.artl-on,
.artp-tx.artp-on,
.ctc-tx.ctc-on {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition:
        opacity 0.8s 0.15s,
        transform 0.8s 0.15s;
}

.abyat-pill,
.abt-pill,
.svcl-pill,
.svcp-pill,
.gal-pill,
.city-pill,
.catl-pill,
.catp-pill,
.artl-pill,
.artp-pill,
.ctc-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.95rem;
    border-radius: 99px;
    background: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: var(--lime);
    font-weight: 700;
    font-size: 0.92rem;
}

.abyat-pill .abyat-dot,
.abt-pill .abt-dot,
.svcl-pill .svcl-dot,
.svcp-pill .svcp-dot,
.gal-pill .gal-dot,
.city-pill .city-dot,
.catl-pill .catl-dot,
.catp-pill .catp-dot,
.artl-pill .artl-dot,
.artp-pill .artp-dot,
.ctc-pill .ctc-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--lime);
}

.abyat-tx .abyat-hl,
.abt-tx .abt-hl,
.svcl-tx .svcl-hl,
.svcp-tx .svcp-hl,
.gal-tx .gal-hl,
.city-tx .city-hl,
.catl-tx .catl-hl,
.catp-tx .catp-hl,
.artl-tx .artl-hl,
.artp-tx .artp-hl,
.ctc-tx .ctc-hl {
    font-size: clamp(2.1rem, 5.5vw, 4rem);
    line-height: 1.25;
    font-weight: 800;
    margin: 1rem 0 0.8rem;
    color: #fff;
}

.abyat-tx .abyat-hl span,
.abyat-pp[aria-pressed="true"] .abyat-ic-play,
.abyat-sh h2 span,
.abt-tx .abt-hl span,
.abt-pp[aria-pressed="true"] .abt-ic-play,
.abt-sh h2 span,
.abt-phead h1 span,
.svcl-tx .svcl-hl span,
.svcl-pp[aria-pressed="true"] .svcl-ic-play,
.svcl-sh h2 span,
.svcl-phead h1 span,
.svcp-tx .svcp-hl span,
.svcp-pp[aria-pressed="true"] .svcp-ic-play,
.svcp-sh h2 span,
.svcp-phead h1 span,
.gal-tx .gal-hl span,
.gal-pp[aria-pressed="true"] .gal-ic-play,
.gal-sh h2 span,
.gal-phead h1 span,
.city-tx .city-hl span,
.city-pp[aria-pressed="true"] .city-ic-play,
.city-sh h2 span,
.city-phead h1 span,
.catl-tx .catl-hl span,
.catl-pp[aria-pressed="true"] .catl-ic-play,
.catl-sh h2 span,
.catl-phead h1 span,
.catp-tx .catp-hl span,
.catp-pp[aria-pressed="true"] .catp-ic-play,
.catp-sh h2 span,
.catp-phead h1 span,
.artl-tx .artl-hl span,
.artl-pp[aria-pressed="true"] .artl-ic-play,
.artl-sh h2 span,
.artl-phead h1 span,
.artp-tx .artp-hl span,
.artp-pp[aria-pressed="true"] .artp-ic-play,
.artp-sh h2 span,
.artp-phead h1 span,
.ctc-tx .ctc-hl span,
.ctc-pp[aria-pressed="true"] .ctc-ic-play,
.ctc-sh h2 span,
.ctc-phead h1 span {
    display: block;
}

.abyat-tx .abyat-hl .abyat-hl-c,
a.abyat-fci:hover strong,
.abt-tx .abt-hl .abt-c,
a.abt-fci:hover strong,
.abt-crumb a:hover,
.svcl-tx .svcl-hl .svcl-c,
a.svcl-fci:hover strong,
.svcl-crumb a:hover,
.svcp-tx .svcp-hl .svcp-c,
a.svcp-fci:hover strong,
.svcp-crumb a:hover,
.svcp-sv-areas svg,
.gal-tx .gal-hl .gal-c,
a.gal-fci:hover strong,
.gal-crumb a:hover,
.city-tx .city-hl .city-c,
a.city-fci:hover strong,
.city-crumb a:hover,
.catl-tx .catl-hl .catl-c,
a.catl-fci:hover strong,
.catl-crumb a:hover,
.catp-tx .catp-hl .catp-c,
a.catp-fci:hover strong,
.catp-crumb a:hover,
.artl-tx .artl-hl .artl-c,
a.artl-fci:hover strong,
.artl-crumb a:hover,
.artp-tx .artp-hl .artp-c,
a.artp-fci:hover strong,
.artp-crumb a:hover,
.artp-ar-facts svg,
.ctc-tx .ctc-hl .ctc-c,
a.ctc-fci:hover strong,
.ctc-crumb a:hover {
    color: var(--lime);
}

.abyat-tx .abyat-hl .abyat-hl-g,
.abt-tx .abt-hl .abt-g,
.abt-phead h1 .abt-g,
.svcl-tx .svcl-hl .svcl-g,
.svcl-phead h1 .svcl-g,
.svcp-tx .svcp-hl .svcp-g,
.svcp-phead h1 .svcp-g,
.gal-tx .gal-hl .gal-g,
.gal-phead h1 .gal-g,
.city-tx .city-hl .city-g,
.city-phead h1 .city-g,
.catl-tx .catl-hl .catl-g,
.catl-phead h1 .catl-g,
.catp-tx .catp-hl .catp-g,
.catp-phead h1 .catp-g,
.artl-tx .artl-hl .artl-g,
.artl-phead h1 .artl-g,
.artp-tx .artp-hl .artp-g,
.artp-phead h1 .artp-g,
.ctc-tx .ctc-hl .ctc-g,
.ctc-phead h1 .ctc-g {
    background: linear-gradient(270deg, #fff, var(--lime) 55%, var(--leaf));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    padding: 0 0 10px 0;
}

.abyat-tx p,
.abt-tx p,
.svcl-tx p,
.svcp-tx p,
.gal-tx p,
.city-tx p,
.catl-tx p,
.catp-tx p,
.artl-tx p,
.artp-tx p,
.ctc-tx p {
    font-size: 1.1rem;
    line-height: 1.9;
    opacity: 0.9;
    margin: 0;
    max-width: 52ch;
}

.abyat-loc,
.abt-loc,
.svcl-loc,
.svcp-loc,
.gal-loc,
.city-loc,
.catl-loc,
.catp-loc,
.artl-loc,
.artp-loc,
.ctc-loc {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 1.1rem;
    font-size: 0.95rem;
    color: var(--leaf-soft);
}

.abyat-btns,
.abt-btns,
.svcl-btns,
.svcp-btns,
.gal-btns,
.city-btns,
.catl-btns,
.catp-btns,
.artl-btns,
.artp-btns,
.ctc-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-top: 1.4rem;
}

.abyat-btn,
.abt-btn,
.svcl-btn,
.svcp-btn,
.gal-btn,
.city-btn,
.catl-btn,
.catp-btn,
.artl-btn,
.artp-btn,
.ctc-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.8rem 1.4rem;
    border-radius: 14px;
    font-weight: 700;
}

.abyat-btn.abyat-btn-p,
.abyat-ar:hover,
.abyat-ask .abyat-mbtn,
.abt-btn.abt-p,
.abt-ar:hover,
.abt-ask .abt-mbtn,
.abt-mbtn.abt-lime,
.svcl-btn.svcl-p,
.svcl-ar:hover,
.svcl-ask .svcl-mbtn,
.svcl-mbtn.svcl-lime,
.svcp-btn.svcp-p,
.svcp-ar:hover,
.svcp-ask .svcp-mbtn,
.svcp-mbtn.svcp-lime,
.gal-btn.gal-p,
.gal-ar:hover,
.gal-ask .gal-mbtn,
.gal-mbtn.gal-lime,
.gal-gtab.gal-on b,
.gal-lb-x:hover,
.gal-lb-ar:hover,
.city-btn.city-p,
.city-ar:hover,
.city-ask .city-mbtn,
.city-mbtn.city-lime,
.catl-btn.catl-p,
.catl-ar:hover,
.catl-ask .catl-mbtn,
.catl-mbtn.catl-lime,
.catl-atab.catl-on b,
.catp-btn.catp-p,
.catp-ar:hover,
.catp-ask .catp-mbtn,
.catp-mbtn.catp-lime,
.catp-atab.catp-on b,
.artl-btn.artl-p,
.artl-ar:hover,
.artl-ask .artl-mbtn,
.artl-mbtn.artl-lime,
.artl-atab.artl-on b,
.artp-btn.artp-p,
.artp-ar:hover,
.artp-ask .artp-mbtn,
.artp-mbtn.artp-lime,
.ctc-btn.ctc-p,
.ctc-ar:hover,
.ctc-ask .ctc-mbtn,
.ctc-mbtn.ctc-lime {
    background: var(--lime);
    color: var(--g9);
}

.abyat-btn.abyat-btn-p:hover,
.abyat-cta:hover,
.abt-btn.abt-p:hover,
.abt-cta:hover,
.svcl-btn.svcl-p:hover,
.svcl-cta:hover,
.svcp-btn.svcp-p:hover,
.svcp-cta:hover,
.svcp-cat-pill:hover,
.gal-btn.gal-p:hover,
.gal-cta:hover,
.city-btn.city-p:hover,
.city-cta:hover,
.catl-btn.catl-p:hover,
.catl-cta:hover,
.catp-btn.catp-p:hover,
.catp-cta:hover,
.artl-btn.artl-p:hover,
.artl-cta:hover,
.artp-btn.artp-p:hover,
.artp-cta:hover,
.artp-cat-pill:hover,
.ctc-btn.ctc-p:hover,
.ctc-cta:hover {
    filter: brightness(0.95);
}

.abyat-btn.abyat-btn-o,
.abt-btn.abt-o,
.svcl-btn.svcl-o,
.svcp-btn.svcp-o,
.gal-btn.gal-o,
.city-btn.city-o,
.catl-btn.catl-o,
.catp-btn.catp-o,
.artl-btn.artl-o,
.artp-btn.artp-o,
.ctc-btn.ctc-o {
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.35);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.abyat-btn.abyat-btn-o:hover,
.abt-btn.abt-o:hover,
.abt-mbtn.abt-ghost:hover,
.svcl-btn.svcl-o:hover,
.svcl-mbtn.svcl-ghost:hover,
.svcp-btn.svcp-o:hover,
.svcp-mbtn.svcp-ghost:hover,
.gal-btn.gal-o:hover,
.gal-mbtn.gal-ghost:hover,
.city-btn.city-o:hover,
.city-mbtn.city-ghost:hover,
.catl-btn.catl-o:hover,
.catl-mbtn.catl-ghost:hover,
.catp-btn.catp-o:hover,
.catp-mbtn.catp-ghost:hover,
.artl-btn.artl-o:hover,
.artl-mbtn.artl-ghost:hover,
.artp-btn.artp-o:hover,
.artp-mbtn.artp-ghost:hover,
.ctc-btn.ctc-o:hover,
.ctc-mbtn.ctc-ghost:hover {
    background: rgba(255, 255, 255, 0.22);
}

.abyat-stats,
.abt-stats,
.svcl-stats,
.svcp-stats,
.gal-stats,
.city-stats,
.catl-stats,
.catp-stats,
.artl-stats,
.artp-stats,
.ctc-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 2rem;
}

.abyat-stat,
.abt-stat,
.svcl-stat,
.svcp-stat,
.gal-stat,
.city-stat,
.catl-stat,
.catp-stat,
.artl-stat,
.artp-stat,
.ctc-stat {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 1.05rem;
    border-radius: 99px;
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.18);
    font-size: 0.92rem;
}

.abyat-stat b,
.abt-stat b,
.svcl-stat b,
.svcp-stat b,
.gal-stat b,
.city-stat b,
.catl-stat b,
.catp-stat b,
.artl-stat b,
.artp-stat b,
.ctc-stat b {
    color: var(--lime);
    font-size: 1.1rem;
    font-weight: 800;
}

.abyat-stat-star {
    width: 1rem;
    height: 1rem;
    color: var(--lime);
    fill: currentColor;
}

.abyat-stat-rating {
    gap: 5px;
}

.abyat-bar,
.abt-bar,
.svcl-bar,
.svcp-bar,
.gal-bar,
.city-bar,
.catl-bar,
.catp-bar,
.artl-bar,
.artp-bar,
.ctc-bar {
    position: absolute;
    z-index: 3;
    bottom: calc(24px + env(safe-area-inset-bottom, 0px));
    inset-inline: 0;
    margin-inline: auto;
    width: min(1350px, calc(100% - 24px));
    padding: 0 24px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    direction: ltr;
}

.abyat-arrows,
.abt-arrows,
.svcl-arrows,
.svcp-arrows,
.gal-arrows,
.city-arrows,
.catl-arrows,
.catp-arrows,
.artl-arrows,
.artp-arrows,
.ctc-arrows {
    display: flex;
    gap: 0.5rem;
}

.abyat-ar,
.abt-ar,
.svcl-ar,
.svcp-ar,
.gal-ar,
.city-ar,
.catl-ar,
.catp-ar,
.artl-ar,
.artp-ar,
.ctc-ar {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: #fff;
    display: grid;
    place-items: center;
    cursor: pointer;
    transition:
        background 0.2s,
        color 0.2s;
}

.abyat-cnt,
.abt-cnt,
.svcl-cnt,
.svcp-cnt,
.gal-cnt,
.city-cnt,
.catl-cnt,
.catp-cnt,
.artl-cnt,
.artp-cnt,
.ctc-cnt {
    text-align: center;
    font-weight: 700;
    font-size: 0.95rem;
    letter-spacing: 0.06em;
}

.abyat-tr,
.abt-tr,
.svcl-tr,
.svcp-tr,
.gal-tr,
.city-tr,
.catl-tr,
.catp-tr,
.artl-tr,
.artp-tr,
.ctc-tr {
    width: 120px;
    height: 3px;
    background: rgba(255, 255, 255, 0.25);
    border-radius: 3px;
    margin: 0.5rem auto 0;
    overflow: hidden;
}

.abyat-fill,
.abt-fill,
.svcl-fill,
.svcp-fill,
.gal-fill,
.city-fill,
.catl-fill,
.catp-fill,
.artl-fill,
.artp-fill,
.ctc-fill {
    height: 100%;
    width: 0;
    background: var(--lime);
}

.abyat-dots,
.abt-dots,
.svcl-dots,
.svcp-dots,
.gal-dots,
.city-dots,
.catl-dots,
.catp-dots,
.artl-dots,
.artp-dots,
.ctc-dots {
    display: flex;
    gap: 0.45rem;
    justify-content: flex-end;
}

.abyat-dt,
.abt-dt,
.svcl-dt,
.svcp-dt,
.gal-dt,
.city-dt,
.catl-dt,
.catp-dt,
.artl-dt,
.artp-dt,
.ctc-dt {
    position: relative;
    width: 8px;
    height: 8px;
    border-radius: 8px;
    border: 0;
    padding: 0;
    background: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    transition:
        width 0.35s,
        background 0.35s;
}

.abyat-dt.abyat-on,
.abt-dt.abt-on,
.svcl-dt.svcl-on,
.svcp-dt.svcp-on,
.gal-dt.gal-on,
.city-dt.city-on,
.catl-dt.catl-on,
.catp-dt.catp-on,
.artl-dt.artl-on,
.artp-dt.artp-on,
.ctc-dt.ctc-on {
    width: 30px;
    background: var(--lime);
}

.abyat-dt::after,
.abt-dt::after,
.svcl-dt::after,
.svcp-dt::after,
.gal-dt::after,
.city-dt::after,
.catl-dt::after,
.catp-dt::after,
.artl-dt::after,
.artp-dt::after,
.ctc-dt::after {
    content: "";
    position: absolute;
    inset: -9px -4px;
}

.abyat-pp .abyat-ic-play,
.abyat-pp[aria-pressed="true"] .abyat-ic-pause,
.abyat-gallery-grid[hidden],
.abyat-pause-btn .abyat-ic-play,
.abyat-pause-btn[aria-pressed="true"] .abyat-ic-pause,
.abyat-fl .abyat-all a::before,
.abyat-mainnav,
.abt-pp .abt-ic-play,
.abt-pp[aria-pressed="true"] .abt-ic-pause,
.abt-gallery-grid[hidden],
.abt-pause-btn .abt-ic-play,
.abt-pause-btn[aria-pressed="true"] .abt-ic-pause,
.abt-fl .abt-all a::before,
.abt-mainnav,
.svcl-pp .svcl-ic-play,
.svcl-pp[aria-pressed="true"] .svcl-ic-pause,
.svcl-gallery-grid[hidden],
.svcl-pause-btn .svcl-ic-play,
.svcl-pause-btn[aria-pressed="true"] .svcl-ic-pause,
.svcl-fl .svcl-all a::before,
.svcl-mainnav,
.svcl-fq summary::-webkit-details-marker,
.svcp-pp .svcp-ic-play,
.svcp-pp[aria-pressed="true"] .svcp-ic-pause,
.svcp-gallery-grid[hidden],
.svcp-pause-btn .svcp-ic-play,
.svcp-pause-btn[aria-pressed="true"] .svcp-ic-pause,
.svcp-fl .svcp-all a::before,
.svcp-mainnav,
.svcp-fq summary::-webkit-details-marker,
.svcp-lb[hidden],
.gal-pp .gal-ic-play,
.gal-pp[aria-pressed="true"] .gal-ic-pause,
.gal-gallery-grid[hidden],
.gal-pause-btn .gal-ic-play,
.gal-pause-btn[aria-pressed="true"] .gal-ic-pause,
.gal-fl .gal-all a::before,
.gal-mainnav,
.gal-fq summary::-webkit-details-marker,
.gal-lb[hidden],
.city-pp .city-ic-play,
.city-pp[aria-pressed="true"] .city-ic-pause,
.city-gallery-grid[hidden],
.city-pause-btn .city-ic-play,
.city-pause-btn[aria-pressed="true"] .city-ic-pause,
.city-fl .city-all a::before,
.city-mainnav,
.city-fq summary::-webkit-details-marker,
.catl-pp .catl-ic-play,
.catl-pp[aria-pressed="true"] .catl-ic-pause,
.catl-gallery-grid[hidden],
.catl-pause-btn .catl-ic-play,
.catl-pause-btn[aria-pressed="true"] .catl-ic-pause,
.catl-fl .catl-all a::before,
.catl-mainnav,
.catl-fq summary::-webkit-details-marker,
.catl-sbox input::-webkit-search-cancel-button,
.catl-qclr[hidden],
.catl-card[hidden],
.catl-aempty[hidden],
.catp-pp .catp-ic-play,
.catp-pp[aria-pressed="true"] .catp-ic-pause,
.catp-gallery-grid[hidden],
.catp-pause-btn .catp-ic-play,
.catp-pause-btn[aria-pressed="true"] .catp-ic-pause,
.catp-fl .catp-all a::before,
.catp-mainnav,
.catp-fq summary::-webkit-details-marker,
.catp-sbox input::-webkit-search-cancel-button,
.catp-qclr[hidden],
.catp-card[hidden],
.catp-aempty[hidden],
.catp-cpanel[hidden],
.artl-pp .artl-ic-play,
.artl-pp[aria-pressed="true"] .artl-ic-pause,
.artl-gallery-grid[hidden],
.artl-pause-btn .artl-ic-play,
.artl-pause-btn[aria-pressed="true"] .artl-ic-pause,
.artl-fl .artl-all a::before,
.artl-mainnav,
.artl-fq summary::-webkit-details-marker,
.artl-sbox input::-webkit-search-cancel-button,
.artl-qclr[hidden],
.artl-card[hidden],
.artl-aempty[hidden],
.artp-pp .artp-ic-play,
.artp-pp[aria-pressed="true"] .artp-ic-pause,
.artp-gallery-grid[hidden],
.artp-pause-btn .artp-ic-play,
.artp-pause-btn[aria-pressed="true"] .artp-ic-pause,
.artp-fl .artp-all a::before,
.artp-mainnav,
.artp-fq summary::-webkit-details-marker,
.ctc-pp .ctc-ic-play,
.ctc-pp[aria-pressed="true"] .ctc-ic-pause,
.ctc-gallery-grid[hidden],
.ctc-pause-btn .ctc-ic-play,
.ctc-pause-btn[aria-pressed="true"] .ctc-ic-pause,
.ctc-fl .ctc-all a::before,
.ctc-mainnav,
.ctc-fq summary::-webkit-details-marker {
    display: none;
}

.abyat-cw,
.abt-cw,
.svcl-cw,
.svcp-cw,
.gal-cw,
.city-cw,
.catl-cw,
.catp-cw,
.artl-cw,
.artp-cw,
.ctc-cw {
    width: min(1350px, calc(100% - 24px));
    margin: 0 auto;
    padding: 0 24px;
}

section h2 {
    font-size: clamp(1.7rem, 3.6vw, 2.6rem);
    line-height: 1.35;
    font-weight: 800;
    margin: 0 0 1rem;
    color: var(--g9);
}

.abyat-tag,
.abt-tag,
.svcl-tag,
.svcp-tag,
.gal-tag,
.city-tag,
.catl-tag,
.catp-tag,
.artl-tag,
.artp-tag,
.ctc-tag {
    padding: 0.4rem 1.1rem;
    border-radius: 99px;
    background: var(--g7);
    color: #fff;
    font-weight: 700;
    font-size: 0.9rem;
    display: block;
    width: fit-content;
    margin: 10px auto;
}
.right-abyat-tag {
    margin: 10px 0;
}
.abyat-mbtn,
.abt-mbtn,
.svcl-mbtn,
.svcp-mbtn,
.gal-mbtn,
.city-mbtn,
.catl-mbtn,
.catp-mbtn,
.artl-mbtn,
.artp-mbtn,
.ctc-mbtn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.8rem 1.4rem;
    border-radius: 14px;
    background: var(--g7);
    color: #fff;
    font-weight: 700;
}

.abyat-mbtn:hover,
.abt-mbtn:hover,
.svcl-mbtn:hover,
.svcp-mbtn:hover,
.gal-mbtn:hover,
.city-mbtn:hover,
.catl-mbtn:hover,
.catp-mbtn:hover,
.artl-mbtn:hover,
.artp-mbtn:hover,
.ctc-mbtn:hover {
    background: var(--g9);
}

.abyat-about,
.abt-about,
.svcl-about,
.svcp-about,
.gal-about,
.city-about,
.catl-about,
.catp-about,
.artl-about,
.artp-about,
.ctc-about {
    background: #fff;
    padding: 96px 0;
}

.abyat-ab,
.abt-ab,
.svcl-ab,
.svcp-ab,
.gal-ab,
.city-ab,
.catl-ab,
.catp-ab,
.artl-ab,
.artp-ab,
.ctc-ab {
    display: grid;
    gap: 3rem;
    align-items: center;
}

.abyat-abt p,
.abt-abt p,
.svcl-abt p,
.svcp-abt p,
.gal-abt p,
.city-abt p,
.catl-abt p,
.catp-abt p,
.artl-abt p,
.artp-abt p,
.ctc-abt p {
    color: var(--mute);
    line-height: 2;
    font-size: 1.05rem;
    margin: 0 0 1.4rem;
    max-width: 56ch;
}

.abyat-vals,
.abt-vals,
.svcl-vals,
.svcp-vals,
.gal-vals,
.city-vals,
.catl-vals,
.catp-vals,
.artl-vals,
.artp-vals,
.ctc-vals {
    list-style: none;
    margin: 0 0 1.8rem;
    padding: 0;
    display: grid;
    gap: 0.7rem;
}

.abyat-vals li,
.abyat-co-list li,
.abt-vals li,
.abt-co-list li,
.svcl-vals li,
.svcl-co-list li,
.svcp-vals li,
.svcp-co-list li,
.gal-vals li,
.gal-co-list li,
.city-vals li,
.city-co-list li,
.catl-vals li,
.catl-co-list li,
.catp-vals li,
.catp-co-list li,
.artl-vals li,
.artl-co-list li,
.artp-vals li,
.artp-co-list li,
.ctc-vals li,
.ctc-co-list li {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    font-weight: 500;
}

.abyat-vals .abyat-ic,
.abt-vals .abt-ic,
.svcl-vals .svcl-ic,
.svcp-vals .svcp-ic,
.gal-vals .gal-ic,
.city-vals .city-ic,
.catl-vals .catl-ic,
.catp-vals .catp-ic,
.artl-vals .artl-ic,
.artp-vals .artp-ic,
.ctc-vals .ctc-ic {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: var(--chip);
    color: var(--g7);
    display: grid;
    place-items: center;
    flex: none;
}

.abyat-abv,
.abt-abv,
.svcl-abv,
.svcp-abv,
.gal-abv,
.city-abv,
.catl-abv,
.catp-abv,
.artl-abv,
.artp-abv,
.ctc-abv {
    position: relative;
    aspect-ratio: 1/1.02;
    max-width: 520px;
    width: 100%;
    margin-inline: auto;
}

.abyat-p1,
.abyat-p2,
.abt-p1,
.abt-p2,
.svcl-p1,
.svcl-p2,
.svcp-p1,
.svcp-p2,
.gal-p1,
.gal-p2,
.city-p1,
.city-p2,
.catl-p1,
.catl-p2,
.catp-p1,
.catp-p2,
.artl-p1,
.artl-p2,
.artp-p1,
.artp-p2,
.ctc-p1,
.ctc-p2 {
    position: absolute;
    overflow: hidden;
    color: var(--leaf);
}

.abyat-p1,
.abt-p1,
.svcl-p1,
.svcp-p1,
.gal-p1,
.city-p1,
.catl-p1,
.catp-p1,
.artl-p1,
.artp-p1,
.ctc-p1 {
    inset: 0 0 14% 18%;
    border-radius: 36px 120px 36px 36px;
    background:
        radial-gradient(60% 50% at 70% 30%, var(--g5), transparent),
        linear-gradient(160deg, var(--g9), var(--g7));
}

.abyat-p2,
.abt-p2,
.svcl-p2,
.svcp-p2,
.gal-p2,
.city-p2,
.catl-p2,
.catp-p2,
.artl-p2,
.artp-p2,
.ctc-p2 {
    width: 48%;
    height: 42%;
    left: 0;
    bottom: 0;
    border-radius: 120px 28px 28px 28px;
    border: 8px solid #fff;
    background:
        radial-gradient(70% 60% at 30% 30%, var(--lime), transparent),
        linear-gradient(200deg, var(--g7), var(--g5));
}

.abyat-p1 svg,
.abyat-p2 svg,
.abt-p1 svg,
.abt-p2 svg,
.svcl-p1 svg,
.svcl-p2 svg,
.svcp-p1 svg,
.svcp-p2 svg,
.gal-p1 svg,
.gal-p2 svg,
.city-p1 svg,
.city-p2 svg,
.catl-p1 svg,
.catl-p2 svg,
.catp-p1 svg,
.catp-p2 svg,
.artl-p1 svg,
.artl-p2 svg,
.artp-p1 svg,
.artp-p2 svg,
.ctc-p1 svg,
.ctc-p2 svg {
    position: absolute;
    fill: currentColor;
    opacity: 0.3;
}

.abyat-p1 svg,
.abt-p1 svg,
.svcl-p1 svg,
.svcp-p1 svg,
.gal-p1 svg,
.city-p1 svg,
.catl-p1 svg,
.catp-p1 svg,
.artl-p1 svg,
.artp-p1 svg,
.ctc-p1 svg {
    width: 70%;
    right: -8%;
    bottom: -6%;
}

.abyat-p2 svg,
.abt-p2 svg,
.svcl-p2 svg,
.svcp-p2 svg,
.gal-p2 svg,
.city-p2 svg,
.catl-p2 svg,
.catp-p2 svg,
.artl-p2 svg,
.artp-p2 svg,
.ctc-p2 svg {
    width: 80%;
    left: -10%;
    top: -10%;
    color: #fff;
    opacity: 0.25;
}

.abyat-badge {
    position: absolute;
    top: 5%;
    left: 5%;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.7rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: abyat-kf-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.abyat-badge b,
.abt-badge b,
.svcl-badge b,
.svcp-badge b,
.gal-badge b,
.city-badge b,
.catl-badge b,
.catp-badge b,
.artl-badge b,
.artp-badge b,
.ctc-badge b {
    font-size: 2.2rem;
    font-weight: 800;
    line-height: 1;
}
.abyat-badge b {
    font-size: 1.2rem;
}
.abyat-svc,
.abt-svc,
.abt-pg,
.svcl-svc,
.svcl-pg,
.svcp-svc,
.svcp-pg,
.gal-svc,
.gal-pg,
.gal-gp,
.city-svc,
.city-pg,
.catl-svc,
.catl-pg,
.catp-svc,
.catp-pg,
.artl-svc,
.artl-pg,
.artp-svc,
.artp-pg,
.ctc-svc,
.ctc-pg {
    padding: 96px 0;
}

.abyat-sh,
.abt-sh,
.svcl-sh,
.svcp-sh,
.gal-sh,
.city-sh,
.catl-sh,
.catp-sh,
.artl-sh,
.artp-sh,
.ctc-sh {
    text-align: center;
    max-width: 620px;
    margin: 0 auto 3rem;
}

.abyat-sh p,
.abt-sh p,
.svcl-sh p,
.svcp-sh p,
.gal-sh p,
.city-sh p,
.catl-sh p,
.catp-sh p,
.artl-sh p,
.artp-sh p,
.ctc-sh p {
    color: var(--mute);
    line-height: 1.9;
    margin: 0;
}

.abyat-grid,
.abt-grid,
.svcl-grid,
.svcp-grid,
.gal-grid,
.city-grid,
.catl-grid,
.catp-grid,
.artl-grid,
.artp-grid,
.ctc-grid {
    display: grid;
    gap: 1.75rem;
    grid-template-columns: repeat(
        auto-fit,
        minmax(min(100%, 400px), min(100%, 400px))
    );
    justify-content: center;
}

.abyat-card,
.abt-card,
.svcl-card,
.svcp-card,
.gal-card,
.city-card,
.catl-card,
.catp-card,
.artl-card,
.artp-card,
.ctc-card {
    --ac: var(--c1);
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    overflow: hidden;
    transition:
        transform 0.35s,
        box-shadow 0.35s;
}

.abyat-k2,
.abt-k2,
.abt-pc.abt-k2,
.svcl-k2,
.svcl-pc.svcl-k2,
.svcp-k2,
.svcp-pc.svcp-k2,
.gal-k2,
.gal-pc.gal-k2,
.city-k2,
.city-pc.city-k2,
.catl-k2,
.catl-pc.catl-k2,
.catl-cc.catl-k2,
.catp-k2,
.catp-pc.catp-k2,
.catp-cc.catp-k2,
.artl-k2,
.artl-pc.artl-k2,
.artp-k2,
.artp-pc.artp-k2,
.artp-ar-kw li:nth-child(6n + 2),
.ctc-k2,
.ctc-pc.ctc-k2 {
    --ac: var(--c2);
}

.abyat-k3,
.abyat-q-time,
.abt-k3,
.abt-q-time,
.abt-pc.abt-k3,
.svcl-k3,
.svcl-q-time,
.svcl-pc.svcl-k3,
.svcp-k3,
.svcp-q-time,
.svcp-pc.svcp-k3,
.gal-k3,
.gal-q-time,
.gal-pc.gal-k3,
.city-k3,
.city-q-time,
.city-pc.city-k3,
.catl-k3,
.catl-q-time,
.catl-pc.catl-k3,
.catl-cc.catl-k3,
.catp-k3,
.catp-q-time,
.catp-pc.catp-k3,
.catp-cc.catp-k3,
.artl-k3,
.artl-q-time,
.artl-pc.artl-k3,
.artp-k3,
.artp-q-time,
.artp-pc.artp-k3,
.artp-ar-kw li:nth-child(6n + 3),
.ctc-k3,
.ctc-q-time,
.ctc-pc.ctc-k3 {
    --ac: var(--c3);
}

.abyat-ph,
.abt-ph,
.svcl-ph,
.svcp-ph,
.gal-ph,
.city-ph,
.catl-ph,
.catp-ph,
.artl-ph,
.artp-ph,
.ctc-ph {
    position: relative;
    height: 230px;
    overflow: hidden;
}

.abyat-im,
.abt-im,
.svcl-im,
.svcp-im,
.gal-im,
.city-im,
.catl-im,
.catp-im,
.artl-im,
.artp-im,
.ctc-im {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(
            60% 60% at 25% 30%,
            color-mix(in srgb, var(--ac) 70%, #fff),
            transparent
        ),
        linear-gradient(150deg, var(--g9), var(--ac));
    transition: transform 0.6s;
}

.abyat-im svg,
.abt-im svg,
.svcl-im svg,
.svcp-im svg,
.gal-im svg,
.gal-pp svg,
.city-im svg,
.catl-im svg,
.catp-im svg,
.artl-im svg,
.artp-im svg,
.ctc-im svg {
    position: absolute;
    width: 55%;
    right: -8%;
    bottom: -12%;
    fill: #fff;
    opacity: 0.18;
}

.abyat-cat,
.abt-cat,
.svcl-cat,
.svcp-cat,
.gal-cat,
.city-cat,
.catl-cat,
.catp-cat,
.artl-cat,
.artp-cat,
.ctc-cat {
    position: absolute;
    right: 14px;
    bottom: 14px;
    padding: 0.4rem 0.9rem;
    border-radius: 99px;
    background: rgba(2, 56, 3, 0.488);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    font-weight: 700;
    font-size: 0.85rem;
}

.abyat-go,
.abt-go,
.svcl-go,
.svcp-go,
.gal-go,
.city-go,
.catl-go,
.catp-go,
.artl-go,
.artp-go,
.ctc-go {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 64px;
    height: 64px;
    margin: -32px 0 0 -32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 1.5rem;
    opacity: 0;
    transform: scale(0.7);
    transition:
        opacity 0.3s,
        transform 0.3s;
}

.abyat-cb,
.abt-cb,
.svcl-cb,
.svcp-cb,
.gal-cb,
.city-cb,
.catl-cb,
.catp-cb,
.artl-cb,
.artp-cb,
.ctc-cb {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 1.7rem;
}

.abyat-cb h3,
.abt-cb h3,
.svcl-cb h3,
.svcp-cb h3,
.gal-cb h3,
.city-cb h3,
.catl-cb h3,
.catp-cb h3,
.artl-cb h3,
.artp-cb h3,
.ctc-cb h3 {
    font-size: 1.45rem;
    font-weight: 800;
    margin: 0 0 0.5rem;
    color: var(--ink);
}

.abyat-cb p,
.abt-cb p,
.svcl-cb p,
.svcp-cb p,
.gal-cb p,
.city-cb p,
.catl-cb p,
.catp-cb p,
.artl-cb p,
.artp-cb p,
.ctc-cb p {
    color: var(--mute);
    line-height: 1.9;
    margin: 0 0 1rem;
    font-size: 0.97rem;
}

.abyat-cb ul,
.abt-cb ul,
.svcl-cb ul,
.svcp-cb ul,
.gal-cb ul,
.city-cb ul,
.catl-cb ul,
.catp-cb ul,
.artl-cb ul,
.artp-cb ul,
.ctc-cb ul {
    list-style: none;
    margin: 0 0 1.2rem;
    padding: 0;
    display: grid;
    gap: 0.55rem;
}

.abyat-cb li,
.abt-cb li,
.svcl-cb li,
.svcp-cb li,
.gal-cb li,
.city-cb li,
.catl-cb li,
.catp-cb li,
.artl-cb li,
.artp-cb li,
.ctc-cb li {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    font-size: 0.98rem;
    line-height: 1.6;
}

.abyat-cb li::before,
.abt-cb li::before,
.svcl-cb li::before,
.svcp-cb li::before,
.gal-cb li::before,
.city-cb li::before,
.catl-cb li::before,
.catp-cb li::before,
.artl-cb li::before,
.artp-cb li::before,
.ctc-cb li::before {
    content: "\2713";
    content: "\2713"/"";
    flex: none;
    width: 20px;
    height: 20px;
    margin-top: 2px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--ac) 15%, #fff);
    color: var(--ac);
    font-size: 0.72rem;
    font-weight: 800;
}

.abyat-ft,
.abt-ft,
.svcl-ft,
.svcp-ft,
.gal-ft,
.city-ft,
.catl-ft,
.catp-ft,
.artl-ft,
.artp-ft,
.ctc-ft {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}

.abyat-more,
.abyat-lbl,
.abt-more,
.abt-lbl,
.svcl-more,
.svcl-lbl,
.svcp-more,
.svcp-lbl,
.gal-more,
.gal-lbl,
.city-more,
.city-lbl,
.catl-more,
.catl-lbl,
.catp-more,
.catp-lbl,
.artl-more,
.artl-lbl,
.artp-more,
.artp-lbl,
.ctc-more,
.ctc-lbl {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--ac);
    font-weight: 700;
}

.abyat-more svg,
.abt-more svg,
.svcl-more svg,
.svcp-more svg,
.gal-more svg,
.city-more svg,
.catl-more svg,
.catp-more svg,
.artl-more svg,
.artp-more svg,
.ctc-more svg {
    transition: transform 0.25s;
}

.abyat-more:hover svg,
.abt-more:hover svg,
.svcl-more:hover svg,
.svcp-more:hover svg,
.gal-more:hover svg,
.city-more:hover svg,
.catl-more:hover svg,
.catp-more:hover svg,
.artl-more:hover svg,
.artp-more:hover svg,
.ctc-more:hover svg {
    transform: translateX(-5px);
}

.abyat-gb,
.abt-gb,
.svcl-gb,
.svcp-gb,
.gal-gb,
.city-gb,
.catl-gb,
.catp-gb,
.artl-gb,
.artp-gb,
.ctc-gb {
    padding: 0.6rem 1.1rem;
    border-radius: 12px;
    background: var(--ac);
    color: #fff;
    font-weight: 700;
    font-size: 0.92rem;
}

.abyat-gb:hover,
.abt-gb:hover,
.svcl-gb:hover,
.svcp-gb:hover,
.gal-gb:hover,
.city-gb:hover,
.catl-gb:hover,
.catp-gb:hover,
.artl-gb:hover,
.artp-gb:hover,
.ctc-gb:hover {
    filter: brightness(0.92);
}

.abyat-sh h2 .abyat-title-a,
.abt-sh h2 .abt-a,
.svcl-sh h2 .svcl-a,
.svcp-sh h2 .svcp-a,
.svcp-sv-info dd a,
.gal-sh h2 .gal-a,
.city-sh h2 .city-a,
.catl-sh h2 .catl-a,
.catp-sh h2 .catp-a,
.artl-sh h2 .artl-a,
.artp-sh h2 .artp-a,
.artp-ar-toc-t svg,
.artp-ar-share-t svg,
.ctc-sh h2 .ctc-a {
    color: var(--g7);
}

.abyat-sh h2 .abyat-title-b,
.abt-sh h2 .abt-b,
.svcl-sh h2 .svcl-b,
.svcp-sh h2 .svcp-b,
.gal-sh h2 .gal-b,
.city-sh h2 .city-b,
.catl-sh h2 .catl-b,
.catp-sh h2 .catp-b,
.artl-sh h2 .artl-b,
.artp-sh h2 .artp-b,
.artp-ar-note strong,
.ctc-sh h2 .ctc-b {
    color: var(--c3);
}

.abyat-allbtn,
.abt-allbtn,
.svcl-allbtn,
.svcp-allbtn,
.gal-allbtn,
.city-allbtn,
.catl-allbtn,
.catp-allbtn,
.artl-allbtn,
.artp-allbtn,
.ctc-allbtn {
    text-align: center;
    margin-top: 2.5rem;
}

.abyat-ask,
.abt-ask,
.svcl-ask,
.svcp-ask,
.gal-ask,
.city-ask,
.catl-ask,
.catp-ask,
.artl-ask,
.artp-ask,
.ctc-ask {
    margin-top: 2.5rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    padding: 1.6rem 2rem;
    border-radius: 26px;
    background: var(--chip);
    border: 1px dashed color-mix(in srgb, var(--g7) 40%, #fff);
}

.abyat-ask h3,
.abt-ask h3,
.svcl-ask h3,
.svcp-ask h3,
.gal-ask h3,
.city-ask h3,
.catl-ask h3,
.catp-ask h3,
.artl-ask h3,
.artp-ask h3,
.ctc-ask h3 {
    margin: 0 0 0.3rem;
    font-size: 1.3rem;
    color: var(--g9);
}

.abyat-ask p,
.abt-ask p,
.svcl-ask p,
.svcp-ask p,
.gal-ask p,
.city-ask p,
.catl-ask p,
.catp-ask p,
.artl-ask p,
.artp-ask p,
.ctc-ask p {
    margin: 0;
    color: var(--mute);
}

.abyat-ask .abyat-mbtn:hover,
.abt-ask .abt-mbtn:hover,
.svcl-ask .svcl-mbtn:hover,
.svcp-ask .svcp-mbtn:hover,
.gal-ask .gal-mbtn:hover,
.city-ask .city-mbtn:hover,
.catl-ask .catl-mbtn:hover,
.catp-ask .catp-mbtn:hover,
.artl-ask .artl-mbtn:hover,
.artp-ask .artp-mbtn:hover,
.ctc-ask .ctc-mbtn:hover {
    filter: brightness(0.95);
    background: var(--lime);
}

.abyat-nums,
.abt-nums,
.svcl-nums,
.svcp-nums,
.gal-nums,
.city-nums,
.catl-nums,
.catp-nums,
.artl-nums,
.artp-nums,
.ctc-nums {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--g9), var(--g7));
    color: #fff;
    padding: 72px 0;
}

.abyat-nl,
.abt-nl,
.svcl-nl,
.svcp-nl,
.gal-nl,
.city-nl,
.catl-nl,
.catp-nl,
.artl-nl,
.artp-nl,
.ctc-nl {
    position: absolute;
    width: 420px;
    left: -80px;
    top: -100px;
    fill: var(--leaf);
    opacity: 0.12;
}

.abyat-ng,
.abt-ng,
.svcl-ng,
.svcp-ng,
.gal-ng,
.city-ng,
.catl-ng,
.catp-ng,
.artl-ng,
.artp-ng,
.ctc-ng {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2.2rem 1rem;
    text-align: center;
}

.abyat-ni,
.abt-ni,
.svcl-ni,
.svcp-ni,
.gal-ni,
.city-ni,
.catl-ni,
.catp-ni,
.artl-ni,
.artp-ni,
.ctc-ni {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
}

.abyat-ni b,
.abt-ni b,
.svcl-ni b,
.svcp-ni b,
.gal-ni b,
.city-ni b,
.catl-ni b,
.catp-ni b,
.artl-ni b,
.artp-ni b,
.ctc-ni b {
    font-size: clamp(2.4rem, 5vw, 3.6rem);
    font-weight: 800;
    color: var(--lime);
    line-height: 1.1;
}

.abyat-ni > span,
.abt-ni > span,
.svcl-ni > span,
.svcp-ni > span,
.gal-ni > span,
.city-ni > span,
.catl-ni > span,
.catp-ni > span,
.artl-ni > span,
.artp-ni > span,
.ctc-ni > span {
    opacity: 0.85;
}

.abyat-areas,
.abt-areas,
.svcl-areas,
.svcp-areas,
.svcp-sv-faq,
.gal-areas,
.city-areas,
.catl-areas,
.catp-areas,
.artl-areas,
.artp-areas,
.artp-ar-related,
.ctc-areas {
    background: color-mix(in srgb, var(--g7) 7%, #fff);
}

.abyat-city,
.abt-city,
.svcl-city,
.svcp-city,
.gal-city,
.city-city,
.catl-city,
.catp-city,
.artl-city,
.artp-city,
.ctc-city {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.85rem;
    border-radius: 99px;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #fff;
    font-weight: 700;
    font-size: 0.85rem;
}

.abyat-cst,
.abt-cst,
.svcl-cst,
.svcp-cst,
.gal-cst,
.city-cst,
.catl-cst,
.catp-cst,
.artl-cst,
.artp-cst,
.ctc-cst {
    position: absolute;
    inset-inline-start: 12px;
    bottom: 12px;
    width: max-content;
    max-width: calc(100% - 24px);
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.4rem 0.9rem;
    border-radius: 99px;
    background: rgba(var(--g9-rgb), 0.55);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    color: #fff;
    font-size: 0.73rem;
}

.abyat-cst div,
.abt-cst div,
.svcl-cst div,
.svcp-cst div,
.gal-cst div,
.city-cst div,
.catl-cst div,
.catp-cst div,
.artl-cst div,
.artp-cst div,
.ctc-cst div {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}

.abyat-cst b,
.abt-cst b,
.svcl-cst b,
.svcp-cst b,
.gal-cst b,
.city-cst b,
.catl-cst b,
.catp-cst b,
.artl-cst b,
.artp-cst b,
.ctc-cst b {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    font-size: 0.82rem;
    font-weight: 800;
    color: var(--lime);
}

.abyat-cst b svg,
.abt-cst b svg,
.svcl-cst b svg,
.svcp-cst b svg,
.gal-cst b svg,
.city-cst b svg,
.catl-cst b svg,
.catp-cst b svg,
.artl-cst b svg,
.artp-cst b svg,
.ctc-cst b svg {
    width: 0.8em;
    height: 0.8em;
    fill: var(--star);
    stroke: none;
}

.abyat-nick,
.abt-nick,
.svcl-nick,
.svcp-nick,
.gal-nick,
.city-nick,
.catl-nick,
.catp-nick,
.artl-nick,
.artp-nick,
.ctc-nick {
    display: block;
    color: var(--ac);
    font-weight: 700;
    font-size: 0.98rem;
    margin: -0.2rem 0 0.7rem;
}

.abyat-nbh,
.abt-nbh,
.svcl-nbh,
.svcp-nbh,
.gal-nbh,
.city-nbh,
.catl-nbh,
.catp-nbh,
.artl-nbh,
.artp-nbh,
.ctc-nbh {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 700;
    font-size: 0.92rem;
    color: var(--ink);
    margin-bottom: 0.6rem;
}

.abyat-nbh svg,
.abyat-art .abyat-meta svg,
.abt-nbh svg,
.abt-art .abt-meta svg,
.svcl-nbh svg,
.svcl-art .svcl-meta svg,
.svcp-nbh svg,
.svcp-art .svcp-meta svg,
.gal-nbh svg,
.gal-art .gal-meta svg,
.city-nbh svg,
.city-art .city-meta svg,
.catl-nbh svg,
.catl-art .catl-meta svg,
.catp-nbh svg,
.catp-art .catp-meta svg,
.artl-nbh svg,
.artl-art .artl-meta svg,
.artp-nbh svg,
.artp-art .artp-meta svg,
.ctc-nbh svg,
.ctc-art .ctc-meta svg {
    color: var(--ac);
}

.abyat-pills,
.abt-pills,
.svcl-pills,
.svcp-pills,
.gal-pills,
.city-pills,
.catl-pills,
.catp-pills,
.artl-pills,
.artp-pills,
.ctc-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-bottom: 1.2rem;
}

.abyat-pills span,
.abt-pills span,
.svcl-pills span,
.svcp-pills span,
.gal-pills span,
.city-pills span,
.catl-pills span,
.catp-pills span,
.artl-pills span,
.artp-pills span,
.ctc-pills span {
    padding: 0.3rem 0.8rem;
    border-radius: 99px;
    font-size: 0.86rem;
    font-weight: 500;
    background: color-mix(in srgb, var(--ac) 12%, #fff);
    color: var(--ac);
    border: 1px solid color-mix(in srgb, var(--ac) 25%, #fff);
}

.abyat-gallery-section,
.abyat-blog-section,
.abt-gallery-section,
.abt-blog-section,
.svcl-gallery-section,
.svcl-blog-section,
.svcp-gallery-section,
.svcp-blog-section,
.gal-gallery-section,
.gal-blog-section,
.city-gallery-section,
.city-blog-section,
.catl-gallery-section,
.catl-blog-section,
.catp-gallery-section,
.catp-blog-section,
.artl-gallery-section,
.artl-blog-section,
.artp-gallery-section,
.artp-blog-section,
.ctc-gallery-section,
.ctc-blog-section {
    padding: 96px 0;
    background: #fff;
}

.abyat-tabs-nav,
.abt-tabs-nav,
.svcl-tabs-nav,
.svcp-tabs-nav,
.gal-tabs-nav,
.city-tabs-nav,
.catl-tabs-nav,
.catp-tabs-nav,
.artl-tabs-nav,
.artp-tabs-nav,
.ctc-tabs-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.6rem;
    margin-bottom: 2.2rem;
}

.abyat-tab-btn,
.abt-tab-btn,
.svcl-tab-btn,
.svcp-tab-btn,
.gal-tab-btn,
.city-tab-btn,
.catl-tab-btn,
.catp-tab-btn,
.artl-tab-btn,
.artp-tab-btn,
.ctc-tab-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 44px;
    padding: 0.65rem 1.4rem;
    border-radius: 99px;
    background: var(--chip);
    color: var(--mute);
    font: inherit;
    font-weight: 700;
    font-size: 0.95rem;
    border: 1px solid var(--line);
    cursor: pointer;
    transition:
        background 0.25s,
        color 0.25s,
        box-shadow 0.25s;
}

.abyat-tab-btn:hover,
.abt-tab-btn:hover,
.svcl-tab-btn:hover,
.svcp-tab-btn:hover,
.gal-tab-btn:hover,
.city-tab-btn:hover,
.catl-tab-btn:hover,
.catp-tab-btn:hover,
.artl-tab-btn:hover,
.artp-tab-btn:hover,
.ctc-tab-btn:hover {
    background: color-mix(in srgb, var(--g7) 12%, #fff);
    color: var(--g7);
}

.abyat-tab-btn.abyat-active,
.abt-tab-btn.abt-active,
.svcl-tab-btn.svcl-active,
.svcp-tab-btn.svcp-active,
.gal-tab-btn.gal-active,
.city-tab-btn.city-active,
.catl-tab-btn.catl-active,
.catp-tab-btn.catp-active,
.artl-tab-btn.artl-active,
.artp-tab-btn.artp-active,
.ctc-tab-btn.ctc-active {
    background: var(--g7);
    color: #fff;
    border-color: var(--g7);
    box-shadow: 0 6px 18px rgba(var(--g9-rgb), 0.15);
}

.abyat-gallery-grid,
.abt-gallery-grid,
.svcl-gallery-grid,
.svcp-gallery-grid,
.gal-gallery-grid,
.city-gallery-grid,
.catl-gallery-grid,
.catp-gallery-grid,
.artl-gallery-grid,
.artp-gallery-grid,
.ctc-gallery-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 150px;
    grid-auto-flow: dense;
}

.abyat-s-tall,
.abt-s-tall,
.svcl-s-tall,
.svcp-s-tall,
.gal-s-tall,
.city-s-tall,
.catl-s-tall,
.catp-s-tall,
.artl-s-tall,
.artp-s-tall,
.ctc-s-tall {
    grid-row: span 2;
}

.abyat-s-wide,
.abt-s-wide,
.svcl-s-wide,
.svcp-s-wide,
.gal-s-wide,
.city-s-wide,
.catl-s-wide,
.catp-s-wide,
.artl-s-wide,
.artp-s-wide,
.ctc-s-wide {
    grid-column: span 2;
}

.abyat-s-big,
.abt-s-big,
.svcl-s-big,
.svcp-s-big,
.gal-s-big,
.city-s-big,
.catl-s-big,
.catp-s-big,
.artl-s-big,
.artp-s-big,
.ctc-s-big {
    grid-column: span 2;
    grid-row: span 2;
}

.abyat-g-card,
.abt-g-card,
.svcl-g-card,
.svcp-g-card,
.gal-g-card,
.city-g-card,
.catl-g-card,
.catp-g-card,
.artl-g-card,
.artp-g-card,
.ctc-g-card {
    position: relative;
    display: block;
    min-width: 0;
    border-radius: 20px;
    overflow: hidden;
    background: var(--g9);
    box-shadow: 0 8px 24px rgba(var(--g9-rgb), 0.08);
    transition:
        transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
        box-shadow 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
    isolation: isolate;
}

.abyat-g-bg,
.abt-g-bg,
.svcl-g-bg,
.svcp-g-bg,
.gal-g-bg,
.city-g-bg,
.catl-g-bg,
.catp-g-bg,
.artl-g-bg,
.artp-g-bg,
.ctc-g-bg {
    position: absolute;
    inset: 0;
    transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.abyat-g-bg img,
.abyat-g-bg video,
.abt-g-bg img,
.abt-g-bg video,
.svcl-g-bg img,
.svcl-g-bg video,
.svcp-g-bg img,
.svcp-g-bg video,
.gal-g-bg img,
.gal-g-bg video,
.city-g-bg img,
.city-g-bg video,
.catl-g-bg img,
.catl-g-bg video,
.catp-g-bg img,
.catp-g-bg video,
.artl-g-bg img,
.artl-g-bg video,
.artp-g-bg img,
.artp-g-bg video,
.ctc-g-bg img,
.ctc-g-bg video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.abyat-g1,
.abt-g1,
.svcl-g1,
.svcp-g1,
.svcp-sv1,
.gal-g1,
.city-g1,
.catl-g1,
.catp-g1,
.artl-g1,
.artp-g1,
.ctc-g1 {
    background:
        radial-gradient(60% 60% at 30% 30%, var(--lime), transparent),
        linear-gradient(150deg, var(--g9), var(--g7));
}

.abyat-g2,
.abt-g2,
.svcl-g2,
.svcp-g2,
.svcp-sv2,
.gal-g2,
.city-g2,
.catl-g2,
.catp-g2,
.artl-g2,
.artp-g2,
.ctc-g2 {
    background:
        radial-gradient(60% 60% at 70% 30%, var(--leaf), transparent),
        linear-gradient(160deg, var(--g9), #0f8b8d);
}

.abyat-g3,
.svcp-sv3,
.gal-g3,
.catl-g3,
.catp-g3,
.artl-g3 {
    background:
        radial-gradient(60% 60% at 30% 70%, var(--lime), transparent),
        linear-gradient(170deg, var(--g9), var(--c3));
}

.abyat-g4,
.abt-g4,
.svcl-g4,
.svcp-g4,
.svcp-sv4,
.gal-g4,
.city-g4,
.catl-g4,
.catp-g4,
.artl-g4,
.artp-g4,
.ctc-g4 {
    background:
        radial-gradient(60% 60% at 50% 30%, var(--g5), transparent),
        linear-gradient(140deg, var(--g9), var(--g7));
}

.abyat-g5,
.abt-g5,
.svcl-g5,
.svcp-g5,
.svcp-sv5,
.gal-g5,
.city-g5,
.catl-g5,
.catp-g5,
.artl-g5,
.artp-g5,
.ctc-g5 {
    background:
        radial-gradient(60% 60% at 20% 40%, var(--leaf), transparent),
        linear-gradient(180deg, var(--g9), #0f8b8d);
}

.abyat-g6,
.abt-g6,
.svcl-g6,
.svcp-g6,
.svcp-sv6,
.gal-g6,
.city-g6,
.catl-g6,
.catp-g6,
.artl-g6,
.artp-g6,
.ctc-g6 {
    background:
        radial-gradient(60% 60% at 80% 60%, var(--lime), transparent),
        linear-gradient(130deg, var(--g9), var(--c3));
}

.abyat-g7-bg,
.abt-g7-bg,
.svcl-g7-bg,
.svcp-g7-bg,
.gal-g7-bg,
.city-g7-bg,
.catl-g7-bg,
.catp-g7-bg,
.artl-g7-bg,
.artp-g7-bg,
.ctc-g7-bg {
    background:
        radial-gradient(60% 60% at 40% 40%, var(--lime), transparent),
        linear-gradient(160deg, var(--g9), var(--g5));
}

.abyat-g-bg > svg,
.abt-g-bg > svg,
.svcl-g-bg > svg,
.svcp-g-bg > svg,
.gal-g-bg > svg,
.city-g-bg > svg,
.catl-g-bg > svg,
.catp-g-bg > svg,
.artl-g-bg > svg,
.artp-g-bg > svg,
.ctc-g-bg > svg {
    position: absolute;
    width: 50%;
    right: -6%;
    bottom: -10%;
    fill: #fff;
    opacity: 0.18;
}

.abyat-g-overlay,
.abt-g-overlay,
.svcl-g-overlay,
.svcp-g-overlay,
.gal-g-overlay,
.city-g-overlay,
.catl-g-overlay,
.catp-g-overlay,
.artl-g-overlay,
.artp-g-overlay,
.ctc-g-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
        to top,
        rgba(var(--g9-rgb), 0.9),
        rgba(var(--g9-rgb), 0.2) 60%,
        transparent
    );
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0.9rem;
    color: #fff;
}

.abyat-g-badge,
.abt-g-badge,
.svcl-g-badge,
.svcp-g-badge,
.gal-g-badge,
.city-g-badge,
.catl-g-badge,
.catp-g-badge,
.artl-g-badge,
.artp-g-badge,
.ctc-g-badge {
    align-self: flex-start;
    padding: 0.3rem 0.75rem;
    border-radius: 99px;
    background: rgba(var(--g9-rgb), 0.55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--lime);
}

.abyat-g-info,
.abt-g-info,
.svcl-g-info,
.svcp-g-info,
.gal-g-info,
.city-g-info,
.catl-g-info,
.catp-g-info,
.artl-g-info,
.artp-g-info,
.ctc-g-info {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.6rem;
}

.abyat-g-title,
.abt-g-title,
.svcl-g-title,
.svcp-g-title,
.gal-g-title,
.city-g-title,
.catl-g-title,
.catp-g-title,
.artl-g-title,
.artp-g-title,
.ctc-g-title {
    margin: 0;
    font-size: 0.92rem;
    line-height: 1.5;
    font-weight: 800;
    color: #fff;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.abyat-s-big .abyat-g-title,
.abyat-s-wide .abyat-g-title,
.abt-s-big .abt-g-title,
.abt-s-wide .abt-g-title,
.svcl-s-big .svcl-g-title,
.svcl-s-wide .svcl-g-title,
.svcp-s-big .svcp-g-title,
.svcp-s-wide .svcp-g-title,
.gal-s-big .gal-g-title,
.gal-s-wide .gal-g-title,
.city-s-big .city-g-title,
.city-s-wide .city-g-title,
.catl-s-big .catl-g-title,
.catl-s-wide .catl-g-title,
.catp-s-big .catp-g-title,
.catp-s-wide .catp-g-title,
.artl-s-big .artl-g-title,
.artl-s-wide .artl-g-title,
.artp-s-big .artp-g-title,
.artp-s-wide .artp-g-title,
.ctc-s-big .ctc-g-title,
.ctc-s-wide .ctc-g-title {
    font-size: 1.1rem;
}

.abyat-g-action,
.abt-g-action,
.svcl-g-action,
.svcp-g-action,
.gal-g-action,
.city-g-action,
.catl-g-action,
.catp-g-action,
.artl-g-action,
.artp-g-action,
.ctc-g-action {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: none;
    place-items: center;
    font-size: 1rem;
    flex: none;
    transition:
        transform 0.3s,
        background 0.3s;
}

.abyat-g-play,
.abt-g-play,
.svcl-g-play,
.svcp-g-play,
.gal-g-play,
.city-g-play,
.catl-g-play,
.catp-g-play,
.artl-g-play,
.artp-g-play,
.ctc-g-play {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    width: 56px;
    height: 56px;
    margin: -28px 0 0 -28px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.5);
    color: #fff;
    display: grid;
    place-items: center;
    pointer-events: none;
}

.abyat-g-play svg,
.abt-g-play svg,
.svcl-g-play svg,
.svcp-g-play svg,
.gal-g-play svg,
.city-g-play svg,
.catl-g-play svg,
.catp-g-play svg,
.artl-g-play svg,
.artp-g-play svg,
.ctc-g-play svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
    stroke: none;
    margin-inline-start: 3px;
}

.abyat-reviews-section,
.abt-reviews-section,
.svcl-reviews-section,
.svcp-reviews-section,
.gal-reviews-section,
.city-reviews-section,
.catl-reviews-section,
.catp-reviews-section,
.artl-reviews-section,
.artp-reviews-section,
.ctc-reviews-section {
    padding: 96px 0;
    background: color-mix(in srgb, var(--g7) 4%, #fff);
    overflow: hidden;
}

.abyat-reviews-head,
.abyat-art,
.abt-reviews-head,
.abt-art,
.abt-cbox > div,
.svcl-reviews-head,
.svcl-art,
.svcl-cbox > div,
.svcl-mapbox > div,
.svcp-reviews-head,
.svcp-art,
.svcp-cbox > div,
.svcp-mapbox > div,
.gal-reviews-head,
.gal-art,
.gal-cbox > div,
.gal-mapbox > div,
.city-reviews-head,
.city-art,
.city-cbox > div,
.city-mapbox > div,
.catl-reviews-head,
.catl-art,
.catl-cbox > div,
.catl-mapbox > div,
.catp-reviews-head,
.catp-art,
.catp-cbox > div,
.catp-mapbox > div,
.artl-reviews-head,
.artl-art,
.artl-cbox > div,
.artl-mapbox > div,
.artp-reviews-head,
.artp-art,
.artp-cbox > div,
.artp-mapbox > div,
.ctc-reviews-head,
.ctc-art,
.ctc-cbox > div,
.ctc-mapbox > div {
    position: relative;
}

.abyat-pause-btn,
.abt-pause-btn,
.svcl-pause-btn,
.svcp-pause-btn,
.gal-pause-btn,
.city-pause-btn,
.catl-pause-btn,
.catp-pause-btn,
.artl-pause-btn,
.artp-pause-btn,
.ctc-pause-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 44px;
    margin: 1.2rem auto 0;
    padding: 0.5rem 1.1rem;
    border-radius: 99px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--g9);
    font: inherit;
    font-weight: 700;
    font-size: 0.9rem;
    cursor: pointer;
}

.abyat-pause-btn:hover,
.abyat-nav.abyat-solid .abyat-links a:hover,
.abyat-nav.abyat-solid .abyat-burger,
.abt-pause-btn:hover,
.abt-nav.abt-solid .abt-links a:hover,
.abt-nav.abt-solid .abt-burger,
.svcl-pause-btn:hover,
.svcl-nav.svcl-solid .svcl-links a:hover,
.svcl-nav.svcl-solid .svcl-burger,
.svcp-pause-btn:hover,
.svcp-nav.svcp-solid .svcp-links a:hover,
.svcp-nav.svcp-solid .svcp-burger,
.gal-pause-btn:hover,
.gal-nav.gal-solid .gal-links a:hover,
.gal-nav.gal-solid .gal-burger,
.city-pause-btn:hover,
.city-nav.city-solid .city-links a:hover,
.city-nav.city-solid .city-burger,
.catl-pause-btn:hover,
.catl-nav.catl-solid .catl-links a:hover,
.catl-nav.catl-solid .catl-burger,
.catp-pause-btn:hover,
.catp-nav.catp-solid .catp-links a:hover,
.catp-nav.catp-solid .catp-burger,
.artl-pause-btn:hover,
.artl-nav.artl-solid .artl-links a:hover,
.artl-nav.artl-solid .artl-burger,
.artp-pause-btn:hover,
.artp-nav.artp-solid .artp-links a:hover,
.artp-nav.artp-solid .artp-burger,
.ctc-pause-btn:hover,
.ctc-nav.ctc-solid .ctc-links a:hover,
.ctc-nav.ctc-solid .ctc-burger {
    background: var(--chip);
}

.abyat-pause-btn[aria-pressed="true"] .abyat-ic-play,
.abt-pause-btn[aria-pressed="true"] .abt-ic-play,
.svcl-pause-btn[aria-pressed="true"] .svcl-ic-play,
.svcp-pause-btn[aria-pressed="true"] .svcp-ic-play,
.gal-pause-btn[aria-pressed="true"] .gal-ic-play,
.city-pause-btn[aria-pressed="true"] .city-ic-play,
.catl-pause-btn[aria-pressed="true"] .catl-ic-play,
.catp-pause-btn[aria-pressed="true"] .catp-ic-play,
.artl-pause-btn[aria-pressed="true"] .artl-ic-play,
.artp-pause-btn[aria-pressed="true"] .artp-ic-play,
.ctc-pause-btn[aria-pressed="true"] .ctc-ic-play {
    display: inline-block;
}

.abyat-slider-container,
.abt-slider-container,
.svcl-slider-container,
.svcp-slider-container,
.gal-slider-container,
.city-slider-container,
.catl-slider-container,
.catp-slider-container,
.artl-slider-container,
.artp-slider-container,
.ctc-slider-container {
    position: relative;
    width: 100%;
    margin-top: 1.8rem;
    overflow: hidden;
    direction: rtl;
}

.abyat-slider-container::before,
.abyat-slider-container::after,
.abt-slider-container::before,
.abt-slider-container::after,
.svcl-slider-container::before,
.svcl-slider-container::after,
.svcp-slider-container::before,
.svcp-slider-container::after,
.gal-slider-container::before,
.gal-slider-container::after,
.city-slider-container::before,
.city-slider-container::after,
.catl-slider-container::before,
.catl-slider-container::after,
.catp-slider-container::before,
.catp-slider-container::after,
.artl-slider-container::before,
.artl-slider-container::after,
.artp-slider-container::before,
.artp-slider-container::after,
.ctc-slider-container::before,
.ctc-slider-container::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: clamp(40px, 9vw, 120px);
    z-index: 5;
    pointer-events: none;
}

.abyat-slider-container::before,
.abt-slider-container::before,
.svcl-slider-container::before,
.svcp-slider-container::before,
.gal-slider-container::before,
.city-slider-container::before,
.catl-slider-container::before,
.catp-slider-container::before,
.artl-slider-container::before,
.artp-slider-container::before,
.ctc-slider-container::before {
    right: 0;
    background: linear-gradient(
        to left,
        color-mix(in srgb, var(--g7) 4%, #fff),
        transparent
    );
}

.abyat-slider-container::after,
.abt-slider-container::after,
.svcl-slider-container::after,
.svcp-slider-container::after,
.gal-slider-container::after,
.city-slider-container::after,
.catl-slider-container::after,
.catp-slider-container::after,
.artl-slider-container::after,
.artp-slider-container::after,
.ctc-slider-container::after {
    left: 0;
    background: linear-gradient(
        to right,
        color-mix(in srgb, var(--g7) 4%, #fff),
        transparent
    );
}

.abyat-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: abyat-kf-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.abyat-train-track.abyat-paused,
.abyat-slider-container:focus-within .abyat-train-track,
.abyat-fab-call:hover,
.abt-train-track.abt-paused,
.abt-slider-container:focus-within .abt-train-track,
.abt-fab-call:hover,
.svcl-train-track.svcl-paused,
.svcl-slider-container:focus-within .svcl-train-track,
.svcl-fab-call:hover,
.svcp-train-track.svcp-paused,
.svcp-slider-container:focus-within .svcp-train-track,
.svcp-fab-call:hover,
.gal-train-track.gal-paused,
.gal-slider-container:focus-within .gal-train-track,
.gal-fab-call:hover,
.city-train-track.city-paused,
.city-slider-container:focus-within .city-train-track,
.city-fab-call:hover,
.catl-train-track.catl-paused,
.catl-slider-container:focus-within .catl-train-track,
.catl-fab-call:hover,
.catp-train-track.catp-paused,
.catp-slider-container:focus-within .catp-train-track,
.catp-fab-call:hover,
.artl-train-track.artl-paused,
.artl-slider-container:focus-within .artl-train-track,
.artl-fab-call:hover,
.artp-train-track.artp-paused,
.artp-slider-container:focus-within .artp-train-track,
.artp-fab-call:hover,
.ctc-train-track.ctc-paused,
.ctc-slider-container:focus-within .ctc-train-track,
.ctc-fab-call:hover {
    animation-play-state: paused;
}

.abyat-slider-container.abyat-static,
.abt-slider-container.abt-static,
.svcl-slider-container.svcl-static,
.svcp-slider-container.svcp-static,
.gal-slider-container.gal-static,
.city-slider-container.city-static,
.catl-slider-container.catl-static,
.catp-slider-container.catp-static,
.artl-slider-container.artl-static,
.artp-slider-container.artp-static,
.ctc-slider-container.ctc-static {
    overflow-x: auto;
    scroll-snap-type: x proximity;
}

.abyat-slider-container.abyat-static .abyat-train-track,
.abt-slider-container.abt-static .abt-train-track,
.svcl-slider-container.svcl-static .svcl-train-track,
.svcp-slider-container.svcp-static .svcp-train-track,
.gal-slider-container.gal-static .gal-train-track,
.city-slider-container.city-static .city-train-track,
.catl-slider-container.catl-static .catl-train-track,
.catp-slider-container.catp-static .catp-train-track,
.artl-slider-container.artl-static .artl-train-track,
.artp-slider-container.artp-static .artp-train-track,
.ctc-slider-container.ctc-static .ctc-train-track {
    animation: none;
}

.abyat-slider-container.abyat-static .abyat-r-card,
.abt-slider-container.abt-static .abt-r-card,
.svcl-slider-container.svcl-static .svcl-r-card,
.svcp-slider-container.svcp-static .svcp-r-card,
.gal-slider-container.gal-static .gal-r-card,
.city-slider-container.city-static .city-r-card,
.catl-slider-container.catl-static .catl-r-card,
.catp-slider-container.catp-static .catp-r-card,
.artl-slider-container.artl-static .artl-r-card,
.artp-slider-container.artp-static .artp-r-card,
.ctc-slider-container.ctc-static .ctc-r-card {
    scroll-snap-align: center;
}

.abyat-r-card,
.abt-r-card,
.svcl-r-card,
.svcp-r-card,
.gal-r-card,
.city-r-card,
.catl-r-card,
.catp-r-card,
.artl-r-card,
.artp-r-card,
.ctc-r-card {
    position: relative;
    width: min(340px, 82vw);
    margin: 0;
    margin-inline-end: 1.5rem;
    background: #fff;
    border-radius: 22px;
    padding: 1.6rem;
    box-shadow: 0 6px 20px rgba(var(--g9-rgb), 0.06);
    border: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: none;
}

.abyat-r-top,
.abt-r-top,
.svcl-r-top,
.svcp-r-top,
.gal-r-top,
.city-r-top,
.catl-r-top,
.catp-r-top,
.artl-r-top,
.artp-r-top,
.ctc-r-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.abyat-r-stars,
.abt-r-stars,
.svcl-r-stars,
.svcp-r-stars,
.gal-r-stars,
.city-r-stars,
.catl-r-stars,
.catp-r-stars,
.artl-r-stars,
.artp-r-stars,
.ctc-r-stars {
    display: flex;
    gap: 2px;
    color: var(--star);
    font-size: 0.9rem;
}

.abyat-r-quote,
.abt-r-quote,
.svcl-r-quote,
.svcp-r-quote,
.gal-r-quote,
.city-r-quote,
.catl-r-quote,
.catp-r-quote,
.artl-r-quote,
.artp-r-quote,
.ctc-r-quote {
    color: rgba(111, 207, 138, 0.45);
    display: grid;
    place-items: center;
}

.abyat-r-quote svg,
.abt-r-quote svg,
.svcl-r-quote svg,
.svcp-r-quote svg,
.gal-r-quote svg,
.city-r-quote svg,
.catl-r-quote svg,
.catp-r-quote svg,
.artl-r-quote svg,
.artp-r-quote svg,
.ctc-r-quote svg {
    width: 2rem;
    height: 2rem;
    fill: currentColor;
    stroke: none;
}

.abyat-r-msg,
.abt-r-msg,
.svcl-r-msg,
.svcp-r-msg,
.gal-r-msg,
.city-r-msg,
.catl-r-msg,
.catp-r-msg,
.artl-r-msg,
.artp-r-msg,
.ctc-r-msg {
    color: var(--mute);
    font-size: 0.97rem;
    line-height: 1.75;
    margin: 0 0 1.4rem;
    flex: 1;
}

.abyat-r-msg p,
.abyat-fbottom p,
.abt-r-msg p,
.abt-fbottom p,
.svcl-r-msg p,
.svcl-fbottom p,
.svcp-r-msg p,
.svcp-fbottom p,
.svcp-fq .svcp-fa p,
.gal-r-msg p,
.gal-fbottom p,
.city-r-msg p,
.city-fbottom p,
.catl-r-msg p,
.catl-fbottom p,
.catp-r-msg p,
.catp-fbottom p,
.artl-r-msg p,
.artl-fbottom p,
.artp-r-msg p,
.artp-fbottom p,
.ctc-r-msg p,
.ctc-fbottom p {
    margin: 0;
}

.abyat-r-footer,
.abt-r-footer,
.svcl-r-footer,
.svcp-r-footer,
.gal-r-footer,
.city-r-footer,
.catl-r-footer,
.catp-r-footer,
.artl-r-footer,
.artp-r-footer,
.ctc-r-footer {
    padding-top: 1rem;
    border-top: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.abyat-r-name,
.abt-r-name,
.svcl-r-name,
.svcp-r-name,
.gal-r-name,
.city-r-name,
.catl-r-name,
.catp-r-name,
.artl-r-name,
.artp-r-name,
.ctc-r-name {
    display: block;
    font-weight: 800;
    font-size: 1.05rem;
    color: var(--g9);
}

.abyat-r-meta,
.abt-r-meta,
.svcl-r-meta,
.svcp-r-meta,
.gal-r-meta,
.city-r-meta,
.catl-r-meta,
.catp-r-meta,
.artl-r-meta,
.artp-r-meta,
.ctc-r-meta {
    display: block;
    font-size: 0.85rem;
    color: var(--mute);
}

.abyat-ar.abyat-pp,
.abt-ar.abt-pp,
.svcl-ar.svcl-pp,
.svcp-ar.svcp-pp,
.gal-ar.gal-pp,
.city-ar.city-pp,
.catl-ar.catl-pp,
.catp-ar.catp-pp,
.artl-ar.artl-pp,
.artp-ar.artp-pp,
.ctc-ar.ctc-pp {
    background: #fff;
    border-color: #fff;
    color: #000;
}

.abyat-ar.abyat-pp:hover,
.abt-ar.abt-pp:hover,
.svcl-ar.svcl-pp:hover,
.svcp-ar.svcp-pp:hover,
.gal-ar.gal-pp:hover,
.city-ar.city-pp:hover,
.catl-ar.catl-pp:hover,
.catp-ar.catp-pp:hover,
.artl-ar.artl-pp:hover,
.artp-ar.artp-pp:hover,
.ctc-ar.ctc-pp:hover {
    background: var(--lime);
    color: #000;
}

.abyat-ar.abyat-pp svg,
.abt-ar.abt-pp svg,
.svcl-ar.svcl-pp svg,
.svcp-ar.svcp-pp svg,
.gal-ar.gal-pp svg,
.city-ar.city-pp svg,
.catl-ar.catl-pp svg,
.catp-ar.catp-pp svg,
.artl-ar.artl-pp svg,
.artp-ar.artp-pp svg,
.ctc-ar.ctc-pp svg {
    width: 1.15em;
    height: 1.15em;
    fill: #000;
    stroke: none;
}

.abyat-pause-btn,
.abt-pause-btn,
.svcl-pause-btn,
.svcp-pause-btn,
.gal-pause-btn,
.city-pause-btn,
.catl-pause-btn,
.catp-pause-btn,
.artl-pause-btn,
.artp-pause-btn,
.ctc-pause-btn {
    color: #000;
}

.abyat-pause-btn svg,
.abt-pause-btn svg,
.svcl-pause-btn svg,
.svcp-pause-btn svg,
.gal-pause-btn svg,
.city-pause-btn svg,
.catl-pause-btn svg,
.catp-pause-btn svg,
.artl-pause-btn svg,
.artp-pause-btn svg,
.ctc-pause-btn svg {
    width: 1.05em;
    height: 1.05em;
    fill: #000;
    stroke: none;
}

.abyat-sh-row,
.abt-sh-row,
.svcl-sh-row,
.svcp-sh-row,
.gal-sh-row,
.city-sh-row,
.catl-sh-row,
.catp-sh-row,
.artl-sh-row,
.artp-sh-row,
.ctc-sh-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.2rem 2rem;
    margin-bottom: 3rem;
}

.abyat-sh.abyat-start,
.abt-sh.abt-start,
.svcl-sh.svcl-start,
.svcp-sh.svcp-start,
.gal-sh.gal-start,
.city-sh.city-start,
.catl-sh.catl-start,
.catp-sh.catp-start,
.artl-sh.artl-start,
.artp-sh.artp-start,
.ctc-sh.ctc-start {
    text-align: start;
    margin: 0;
    max-width: 640px;
}

.abyat-card .abyat-acat,
.abt-card .abt-acat,
.svcl-card .svcl-acat,
.svcp-card .svcp-acat,
.gal-card .gal-acat,
.city-card .city-acat,
.catl-card .catl-acat,
.catp-card .catp-acat,
.artl-card .artl-acat,
.artp-card .artp-acat,
.ctc-card .ctc-acat {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.9rem;
    border-radius: 99px;
    background: rgba(2, 56, 3, 0.488);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #fff;
    font-weight: 700;
    font-size: 0.85rem;
}

.abyat-art .abyat-ph,
.abt-art .abt-ph,
.svcl-art .svcl-ph,
.svcp-art .svcp-ph,
.gal-art .gal-ph,
.city-art .city-ph,
.catl-art .catl-ph,
.catp-art .catp-ph,
.artl-art .artl-ph,
.artp-art .artp-ph,
.ctc-art .ctc-ph {
    height: 220px;
}

.abyat-art .abyat-cb h3,
.abt-art .abt-cb h3,
.svcl-art .svcl-cb h3,
.svcp-art .svcp-cb h3,
.gal-art .gal-cb h3,
.city-art .city-cb h3,
.catl-art .catl-cb h3,
.catp-art .catp-cb h3,
.artl-art .artl-cb h3,
.artp-art .artp-cb h3,
.ctc-art .ctc-cb h3 {
    font-size: 1.25rem;
    line-height: 1.6;
}

.abyat-art .abyat-meta,
.abt-art .abt-meta,
.svcl-art .svcl-meta,
.svcp-art .svcp-meta,
.gal-art .gal-meta,
.city-art .city-meta,
.catl-art .catl-meta,
.catp-art .catp-meta,
.artl-art .artl-meta,
.artp-art .artp-meta,
.ctc-art .ctc-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem 1.1rem;
    margin: 0 0 0.75rem;
    padding: 0;
    list-style: none;
    color: var(--mute);
    font-size: 0.88rem;
}

.abyat-art .abyat-meta li,
.abt-art .abt-meta li,
.svcl-art .svcl-meta li,
.svcp-art .svcp-meta li,
.gal-art .gal-meta li,
.city-art .city-meta li,
.catl-art .catl-meta li,
.catp-art .catp-meta li,
.artl-art .artl-meta li,
.artp-art .artp-meta li,
.ctc-art .ctc-meta li {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.88rem;
}

.abyat-art .abyat-meta li::before,
.abt-art .abt-meta li::before,
.svcl-art .svcl-meta li::before,
.svcp-art .svcp-meta li::before,
.gal-art .gal-meta li::before,
.city-art .city-meta li::before,
.catl-art .catl-meta li::before,
.catp-art .catp-meta li::before,
.artl-art .artl-meta li::before,
.artp-art .artp-meta li::before,
.ctc-art .ctc-meta li::before {
    content: none;
    display: none;
}

.abyat-art .abyat-more::after,
.abt-art .abt-more::after,
.svcl-art .svcl-more::after,
.svcp-art .svcp-more::after,
.gal-art .gal-more::after,
.city-art .city-more::after,
.catl-art .catl-more::after,
.catp-art .catp-more::after,
.artl-art .artl-more::after,
.artp-art .artp-more::after,
.ctc-art .ctc-more::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: 24px;
}

.abyat-art .abyat-more:focus-visible::after,
:focus-visible,
.abt-art .abt-more:focus-visible::after,
.svcl-art .svcl-more:focus-visible::after,
.svcp-art .svcp-more:focus-visible::after,
.gal-art .gal-more:focus-visible::after,
.city-art .city-more:focus-visible::after,
.catl-art .catl-more:focus-visible::after,
.catl-cc:focus-visible,
.catp-art .catp-more:focus-visible::after,
.catp-cc:focus-visible,
.artl-art .artl-more:focus-visible::after,
.artp-art .artp-more:focus-visible::after,
.ctc-art .ctc-more:focus-visible::after {
    outline: 3px solid var(--g7);
    outline-offset: 3px;
}

.abyat-contact-section,
.abt-contact-section,
.svcl-contact-section,
.svcp-contact-section,
.gal-contact-section,
.city-contact-section,
.catl-contact-section,
.catp-contact-section,
.artl-contact-section,
.artp-contact-section,
.ctc-contact-section {
    padding: 96px 0;
    background: color-mix(in srgb, var(--g7) 7%, #fff);
}

.abyat-contact-section .abyat-sh,
.abt-contact-section .abt-sh,
.svcl-contact-section .svcl-sh,
.svcp-contact-section .svcp-sh,
.gal-contact-section .gal-sh,
.city-contact-section .city-sh,
.catl-contact-section .catl-sh,
.catp-contact-section .catp-sh,
.artl-contact-section .artl-sh,
.artp-contact-section .artp-sh,
.ctc-contact-section .ctc-sh {
    margin-bottom: 2.2rem;
}

.abyat-qc,
.abt-qc,
.svcl-qc,
.svcp-qc,
.gal-qc,
.city-qc,
.catl-qc,
.catp-qc,
.artl-qc,
.artp-qc,
.ctc-qc {
    display: grid;
    gap: 1.1rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
    margin-bottom: 1.75rem;
}

.abyat-qc-item,
.abt-qc-item,
.svcl-qc-item,
.svcp-qc-item,
.gal-qc-item,
.city-qc-item,
.catl-qc-item,
.catp-qc-item,
.artl-qc-item,
.artp-qc-item,
.ctc-qc-item {
    --ac: var(--g7);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.3rem;
    padding: 1.5rem 1rem;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    transition:
        transform 0.3s,
        box-shadow 0.3s,
        border-color 0.3s;
}

.abyat-qc-item .abyat-qi,
.abt-qc-item .abt-qi,
.svcl-qc-item .svcl-qi,
.svcp-qc-item .svcp-qi,
.gal-qc-item .gal-qi,
.city-qc-item .city-qi,
.catl-qc-item .catl-qi,
.catp-qc-item .catp-qi,
.artl-qc-item .artl-qi,
.artp-qc-item .artp-qi,
.ctc-qc-item .ctc-qi {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--ac) 12%, #fff);
    color: var(--ac);
    margin-bottom: 0.45rem;
}

.abyat-qc-item .abyat-qi svg,
.abt-qc-item .abt-qi svg,
.svcl-qc-item .svcl-qi svg,
.svcp-qc-item .svcp-qi svg,
.gal-qc-item .gal-qi svg,
.city-qc-item .city-qi svg,
.catl-qc-item .catl-qi svg,
.catp-qc-item .catp-qi svg,
.artl-qc-item .artl-qi svg,
.artp-qc-item .artp-qi svg,
.ctc-qc-item .ctc-qi svg {
    width: 1.6rem;
    height: 1.6rem;
}

.abyat-qc-item small,
.abt-qc-item small,
.svcl-qc-item small,
.svcp-qc-item small,
.gal-qc-item small,
.city-qc-item small,
.catl-qc-item small,
.catp-qc-item small,
.artl-qc-item small,
.artp-qc-item small,
.ctc-qc-item small {
    color: var(--ac);
    font-weight: 800;
    font-size: 0.95rem;
}

.abyat-qc-item strong,
.abt-qc-item strong,
.svcl-qc-item strong,
.svcp-qc-item strong,
.gal-qc-item strong,
.city-qc-item strong,
.catl-qc-item strong,
.catp-qc-item strong,
.artl-qc-item strong,
.artp-qc-item strong,
.ctc-qc-item strong {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.6;
}

.abyat-num,
.abt-num,
.svcl-num,
.svcp-num,
.gal-num,
.city-num,
.catl-num,
.catp-num,
.artl-num,
.artp-num,
.ctc-num {
    direction: ltr;
    unicode-bidi: isolate;
    display: inline-block;
}

.abyat-q-phone,
.abt-q-phone,
.svcl-q-phone,
.svcp-q-phone,
.gal-q-phone,
.city-q-phone,
.catl-q-phone,
.catp-q-phone,
.artl-q-phone,
.artp-q-phone,
.artp-ar-kw li:nth-child(6n + 4),
.ctc-q-phone {
    --ac: #1b64b0;
}

.abyat-q-wa,
.abt-q-wa,
.svcl-q-wa,
.svcp-q-wa,
.gal-q-wa,
.city-q-wa,
.catl-q-wa,
.catp-q-wa,
.artl-q-wa,
.artp-q-wa,
.ctc-q-wa {
    --ac: #12803c;
}

.abyat-q-mail,
.abt-q-mail,
.svcl-q-mail,
.svcp-q-mail,
.gal-q-mail,
.city-q-mail,
.catl-q-mail,
.catp-q-mail,
.artl-q-mail,
.artp-q-mail,
.artp-ar-kw li:nth-child(6n + 6),
.ctc-q-mail {
    --ac: #b3261e;
}

.abyat-cgrid,
.abt-cgrid,
.svcl-cgrid,
.svcp-cgrid,
.gal-cgrid,
.city-cgrid,
.catl-cgrid,
.catp-cgrid,
.artl-cgrid,
.artp-cgrid,
.ctc-cgrid {
    display: grid;
    gap: 1.75rem;
    align-items: stretch;
}

.abyat-cinfo,
.abt-cinfo,
.svcl-cinfo,
.svcp-cinfo,
.gal-cinfo,
.city-cinfo,
.catl-cinfo,
.catp-cinfo,
.artl-cinfo,
.artp-cinfo,
.ctc-cinfo {
    display: grid;
    gap: 1.1rem;
    align-content: start;
}

.abyat-ccard,
.abt-ccard,
.svcl-ccard,
.svcp-ccard,
.gal-ccard,
.city-ccard,
.catl-ccard,
.catp-ccard,
.artl-ccard,
.artp-ccard,
.ctc-ccard {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 1.6rem;
}

.abyat-co-head,
.abt-co-head,
.svcl-co-head,
.svcp-co-head,
.gal-co-head,
.city-co-head,
.catl-co-head,
.catp-co-head,
.artl-co-head,
.artp-co-head,
.ctc-co-head {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.abyat-co-logo,
.abt-co-logo,
.svcl-co-logo,
.svcp-co-logo,
.gal-co-logo,
.city-co-logo,
.catl-co-logo,
.catp-co-logo,
.artl-co-logo,
.artp-co-logo,
.ctc-co-logo {
    width: 64px;
    height: 64px;
    border-radius: 20px;
    color: var(--g9);
    display: grid;
    place-items: center;
    flex: none;
    overflow: hidden;
}

.abyat-co-logo svg,
.abt-co-logo svg,
.svcl-co-logo svg,
.svcp-co-logo svg,
.gal-co-logo svg,
.city-co-logo svg,
.catl-co-logo svg,
.catp-co-logo svg,
.artl-co-logo svg,
.artp-co-logo svg,
.ctc-co-logo svg {
    width: 32px;
    height: 32px;
}

.abyat-co-logo img,
.abt-co-logo img,
.svcl-co-logo img,
.svcp-co-logo img,
.gal-co-logo img,
.city-co-logo img,
.catl-co-logo img,
.catp-co-logo img,
.artl-co-logo img,
.artp-co-logo img,
.ctc-co-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.abyat-co-head h3,
.abt-co-head h3,
.svcl-co-head h3,
.svcp-co-head h3,
.gal-co-head h3,
.city-co-head h3,
.catl-co-head h3,
.catp-co-head h3,
.artl-co-head h3,
.artp-co-head h3,
.ctc-co-head h3 {
    margin: 0;
    font-size: 1.45rem;
    font-weight: 800;
    color: var(--g9);
}

.abyat-ccard > p,
.abt-ccard > p,
.svcl-ccard > p,
.svcp-ccard > p,
.gal-ccard > p,
.city-ccard > p,
.catl-ccard > p,
.catp-ccard > p,
.artl-ccard > p,
.artp-ccard > p,
.ctc-ccard > p {
    color: var(--mute);
    line-height: 1.9;
    margin: 0 0 1.3rem;
}

.abyat-co-list,
.abt-co-list,
.svcl-co-list,
.svcp-co-list,
.gal-co-list,
.city-co-list,
.catl-co-list,
.catp-co-list,
.artl-co-list,
.artp-co-list,
.ctc-co-list {
    list-style: none;
    margin: 0;
    padding: 1.2rem 0 0;
    border-top: 1px solid var(--line);
    display: grid;
    gap: 0.85rem;
}

.abyat-co-list .abyat-ic,
.abt-co-list .abt-ic,
.svcl-co-list .svcl-ic,
.svcp-co-list .svcp-ic,
.gal-co-list .gal-ic,
.city-co-list .city-ic,
.catl-co-list .catl-ic,
.catp-co-list .catp-ic,
.artl-co-list .artl-ic,
.artp-co-list .artp-ic,
.ctc-co-list .ctc-ic {
    width: 40px;
    height: 40px;
    border-radius: 13px;
    background: var(--chip);
    color: var(--g7);
    display: grid;
    place-items: center;
    flex: none;
}

.abyat-cstats,
.abt-cstats,
.svcl-cstats,
.svcp-cstats,
.gal-cstats,
.city-cstats,
.catl-cstats,
.catp-cstats,
.artl-cstats,
.artp-cstats,
.ctc-cstats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
}

.abyat-cs,
.abt-cs,
.svcl-cs,
.svcp-cs,
.gal-cs,
.city-cs,
.catl-cs,
.catp-cs,
.artl-cs,
.artp-cs,
.ctc-cs {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 1rem 0.4rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
}

.abyat-cs b,
.abt-cs b,
.svcl-cs b,
.svcp-cs b,
.gal-cs b,
.city-cs b,
.catl-cs b,
.catp-cs b,
.artl-cs b,
.artp-cs b,
.ctc-cs b {
    font-size: clamp(1.45rem, 3vw, 2rem);
    font-weight: 800;
    color: var(--g7);
    line-height: 1.15;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.abyat-cs b svg,
.abt-cs b svg,
.svcl-cs b svg,
.svcp-cs b svg,
.gal-cs b svg,
.city-cs b svg,
.catl-cs b svg,
.catp-cs b svg,
.artl-cs b svg,
.artp-cs b svg,
.ctc-cs b svg {
    width: 0.75em;
    height: 0.75em;
    fill: var(--star);
    stroke: none;
}

.abyat-cs span,
.abt-cs span,
.svcl-cs span,
.svcp-cs span,
.gal-cs span,
.city-cs span,
.catl-cs span,
.catp-cs span,
.artl-cs span,
.artp-cs span,
.ctc-cs span {
    font-size: 0.9rem;
    color: var(--mute);
}

.abyat-csoc h3,
.abt-csoc h3,
.svcl-csoc h3,
.svcp-csoc h3,
.gal-csoc h3,
.city-csoc h3,
.catl-csoc h3,
.catp-csoc h3,
.artl-csoc h3,
.artp-csoc h3,
.ctc-csoc h3 {
    margin: 0 0 0.9rem;
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--g9);
}

.abyat-soc4,
.abt-soc4,
.svcl-soc4,
.svcp-soc4,
.gal-soc4,
.city-soc4,
.catl-soc4,
.catp-soc4,
.artl-soc4,
.artp-soc4,
.ctc-soc4 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.abyat-soc4 a,
.abt-soc4 a,
.svcl-soc4 a,
.svcp-soc4 a,
.gal-soc4 a,
.city-soc4 a,
.catl-soc4 a,
.catp-soc4 a,
.artl-soc4 a,
.artp-soc4 a,
.ctc-soc4 a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 72px;
    padding: 0.7rem 0.4rem;
    border-radius: 16px;
    color: #fff;
    font-weight: 700;
    font-size: 0.88rem;
    transition:
        transform 0.25s,
        filter 0.25s;
}

.abyat-soc4 a:hover,
.abt-soc4 a:hover,
.svcl-soc4 a:hover,
.svcp-soc4 a:hover,
.gal-soc4 a:hover,
.city-soc4 a:hover,
.catl-soc4 a:hover,
.catp-soc4 a:hover,
.artl-soc4 a:hover,
.artp-soc4 a:hover,
.ctc-soc4 a:hover {
    filter: brightness(1.08);
    transform: translateY(-2px);
}

.abyat-soc4 svg.abyat-icon,
.abyat-soc svg.abyat-icon,
.abt-soc4 svg.abt-i,
.abt-soc svg.abt-i,
.svcl-soc4 svg.svcl-i,
.svcl-soc svg.svcl-i,
.svcp-soc4 svg.svcp-i,
.svcp-soc svg.svcp-i,
.svcp-lb-nav svg,
.gal-soc4 svg.gal-i,
.gal-soc svg.gal-i,
.city-soc4 svg.city-i,
.city-soc svg.city-i,
.catl-soc4 svg.catl-i,
.catl-soc svg.catl-i,
.catp-soc4 svg.catp-i,
.catp-soc svg.catp-i,
.artl-soc4 svg.artl-i,
.artl-soc svg.artl-i,
.artp-soc4 svg.artp-i,
.artp-soc svg.artp-i,
.ctc-soc4 svg.ctc-i,
.ctc-soc svg.ctc-i {
    width: 1.5rem;
    height: 1.5rem;
}

.abyat-soc4 .fa-snapchat,
.ctc-soc4 .fa-snapchat {
    font-size: 1.5rem;
}

.abyat-fsoc .fa-snapchat {
    font-size: 1.3rem;
}

.abyat-s-wa,
.abt-s-wa,
.svcl-s-wa,
.svcp-s-wa,
.gal-s-wa,
.city-s-wa,
.catl-s-wa,
.catp-s-wa,
.artl-s-wa,
.artp-s-wa,
.artp-sb-wa,
.ctc-s-wa {
    background: #0f7a3f;
}

.abyat-s-ig,
.abt-s-ig,
.svcl-s-ig,
.svcp-s-ig,
.gal-s-ig,
.city-s-ig,
.catl-s-ig,
.catp-s-ig,
.artl-s-ig,
.artp-s-ig,
.ctc-s-ig {
    background: linear-gradient(45deg, #c2410c, #c0267a 55%, #6d28d9);
}

.abyat-s-x,
.abyat-tk,
.abt-s-x,
.abt-tk,
.svcl-s-x,
.svcl-tk,
.svcp-s-x,
.svcp-tk,
.gal-s-x,
.gal-tk,
.city-s-x,
.city-tk,
.catl-s-x,
.catl-tk,
.catp-s-x,
.catp-tk,
.artl-s-x,
.artl-tk,
.artp-s-x,
.artp-tk,
.artp-sb-x,
.ctc-s-x,
.ctc-tk {
    background: #000;
}

.abyat-s-yt,
.abt-s-yt,
.svcl-s-yt,
.svcp-s-yt,
.gal-s-yt,
.city-s-yt,
.catl-s-yt,
.catp-s-yt,
.artl-s-yt,
.artp-s-yt,
.ctc-s-yt {
    background: #c4161c;
}
.ctc-s-snap {
    background: #fffc00;
    color: #111 !important;
}
.ctc-s-tg {
    background: #229ed9;
}
.ctc-s-fb {
    background: #1877f2;
}
.abyat-snap {
    background: #fffc00;
    color: #111 !important;
}
.abyat-tg {
    background: #229ed9;
}
.abyat-s-fb {
    background: #1877f2;
}

.abyat-cform,
.abt-cform,
.svcl-cform,
.svcp-cform,
.gal-cform,
.city-cform,
.catl-cform,
.catp-cform,
.artl-cform,
.artp-cform,
.ctc-cform {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 2rem;
}

.abyat-cform h3,
.abt-cform h3,
.svcl-cform h3,
.svcp-cform h3,
.gal-cform h3,
.city-cform h3,
.catl-cform h3,
.catp-cform h3,
.artl-cform h3,
.artp-cform h3,
.ctc-cform h3 {
    margin: 0 0 0.3rem;
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--g9);
}

.abyat-cform .abyat-sub,
.abt-cform .abt-sub,
.svcl-cform .svcl-sub,
.svcp-cform .svcp-sub,
.gal-cform .gal-sub,
.city-cform .city-sub,
.catl-cform .catl-sub,
.catp-cform .catp-sub,
.artl-cform .artl-sub,
.artp-cform .artp-sub,
.ctc-cform .ctc-sub {
    color: var(--mute);
    margin: 0 0 1.5rem;
    line-height: 1.8;
}

.abyat-fgrid,
.abt-fgrid,
.svcl-fgrid,
.svcp-fgrid,
.gal-fgrid,
.city-fgrid,
.catl-fgrid,
.catp-fgrid,
.artl-fgrid,
.artp-fgrid,
.ctc-fgrid {
    display: grid;
    gap: 1.1rem;
    grid-template-columns: minmax(0, 1fr);
}

.abyat-fld label,
.abt-fld label,
.svcl-fld label,
.svcp-fld label,
.gal-fld label,
.city-fld label,
.catl-fld label,
.catp-fld label,
.artl-fld label,
.artp-fld label,
.ctc-fld label {
    display: block;
    margin-bottom: 0.45rem;
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--g9);
}

.abyat-fld .abyat-req,
.abt-fld .abt-req,
.svcl-fld .svcl-req,
.svcp-fld .svcp-req,
.gal-fld .gal-req,
.city-fld .city-req,
.catl-fld .catl-req,
.catp-fld .catp-req,
.artl-fld .artl-req,
.artp-fld .artp-req,
.ctc-fld .ctc-req {
    color: #b3261e;
    margin-inline-start: 0.2rem;
}

.abyat-fld input,
.abyat-fld select,
.abyat-fld textarea,
.abt-fld input,
.abt-fld select,
.abt-fld textarea,
.svcl-fld input,
.svcl-fld select,
.svcl-fld textarea,
.svcp-fld input,
.svcp-fld select,
.svcp-fld textarea,
.gal-fld input,
.gal-fld select,
.gal-fld textarea,
.city-fld input,
.city-fld select,
.city-fld textarea,
.catl-fld input,
.catl-fld select,
.catl-fld textarea,
.catp-fld input,
.catp-fld select,
.catp-fld textarea,
.artl-fld input,
.artl-fld select,
.artl-fld textarea,
.artp-fld input,
.artp-fld select,
.artp-fld textarea,
.ctc-fld input,
.ctc-fld select,
.ctc-fld textarea {
    display: block;
    width: 100%;
    min-height: 52px;
    padding: 0.85rem 1rem;
    font: inherit;
    font-size: 1rem;
    color: var(--ink);
    background: var(--paper);
    border: 1.5px solid #c9d4cc;
    border-radius: 14px;
    transition:
        border-color 0.2s,
        background 0.2s,
        box-shadow 0.2s;
}

.abyat-fld input::placeholder,
.abyat-fld textarea::placeholder,
.abyat-fld select:invalid,
.abt-fld input::placeholder,
.abt-fld textarea::placeholder,
.abt-fld select:invalid,
.svcl-fld input::placeholder,
.svcl-fld textarea::placeholder,
.svcl-fld select:invalid,
.svcp-fld input::placeholder,
.svcp-fld textarea::placeholder,
.svcp-fld select:invalid,
.gal-fld input::placeholder,
.gal-fld textarea::placeholder,
.gal-fld select:invalid,
.city-fld input::placeholder,
.city-fld textarea::placeholder,
.city-fld select:invalid,
.catl-fld input::placeholder,
.catl-fld textarea::placeholder,
.catl-fld select:invalid,
.catp-fld input::placeholder,
.catp-fld textarea::placeholder,
.catp-fld select:invalid,
.artl-fld input::placeholder,
.artl-fld textarea::placeholder,
.artl-fld select:invalid,
.artp-fld input::placeholder,
.artp-fld textarea::placeholder,
.artp-fld select:invalid,
.ctc-fld input::placeholder,
.ctc-fld textarea::placeholder,
.ctc-fld select:invalid {
    color: #74857b;
}

.abyat-fld input:hover,
.abyat-fld select:hover,
.abyat-fld textarea:hover,
.abt-fld input:hover,
.abt-fld select:hover,
.abt-fld textarea:hover,
.svcl-fld input:hover,
.svcl-fld select:hover,
.svcl-fld textarea:hover,
.svcp-fld input:hover,
.svcp-fld select:hover,
.svcp-fld textarea:hover,
.gal-fld input:hover,
.gal-fld select:hover,
.gal-fld textarea:hover,
.city-fld input:hover,
.city-fld select:hover,
.city-fld textarea:hover,
.catl-fld input:hover,
.catl-fld select:hover,
.catl-fld textarea:hover,
.catp-fld input:hover,
.catp-fld select:hover,
.catp-fld textarea:hover,
.artl-fld input:hover,
.artl-fld select:hover,
.artl-fld textarea:hover,
.artp-fld input:hover,
.artp-fld select:hover,
.artp-fld textarea:hover,
.ctc-fld input:hover,
.ctc-fld select:hover,
.ctc-fld textarea:hover {
    border-color: var(--g5);
}

.abyat-fld input:focus,
.abyat-fld select:focus,
.abyat-fld textarea:focus,
.abt-fld input:focus,
.abt-fld select:focus,
.abt-fld textarea:focus,
.svcl-fld input:focus,
.svcl-fld select:focus,
.svcl-fld textarea:focus,
.svcp-fld input:focus,
.svcp-fld select:focus,
.svcp-fld textarea:focus,
.gal-fld input:focus,
.gal-fld select:focus,
.gal-fld textarea:focus,
.city-fld input:focus,
.city-fld select:focus,
.city-fld textarea:focus,
.catl-fld input:focus,
.catl-fld select:focus,
.catl-fld textarea:focus,
.catp-fld input:focus,
.catp-fld select:focus,
.catp-fld textarea:focus,
.artl-fld input:focus,
.artl-fld select:focus,
.artl-fld textarea:focus,
.artp-fld input:focus,
.artp-fld select:focus,
.artp-fld textarea:focus,
.ctc-fld input:focus,
.ctc-fld select:focus,
.ctc-fld textarea:focus {
    background: #fff;
    border-color: var(--g7);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--g7) 16%, transparent);
}

.abyat-fld input:user-invalid,
.abyat-fld select:user-invalid,
.abyat-fld textarea:user-invalid,
.abt-fld input:user-invalid,
.abt-fld select:user-invalid,
.abt-fld textarea:user-invalid,
.svcl-fld input:user-invalid,
.svcl-fld select:user-invalid,
.svcl-fld textarea:user-invalid,
.svcp-fld input:user-invalid,
.svcp-fld select:user-invalid,
.svcp-fld textarea:user-invalid,
.gal-fld input:user-invalid,
.gal-fld select:user-invalid,
.gal-fld textarea:user-invalid,
.city-fld input:user-invalid,
.city-fld select:user-invalid,
.city-fld textarea:user-invalid,
.catl-fld input:user-invalid,
.catl-fld select:user-invalid,
.catl-fld textarea:user-invalid,
.catp-fld input:user-invalid,
.catp-fld select:user-invalid,
.catp-fld textarea:user-invalid,
.artl-fld input:user-invalid,
.artl-fld select:user-invalid,
.artl-fld textarea:user-invalid,
.artp-fld input:user-invalid,
.artp-fld select:user-invalid,
.artp-fld textarea:user-invalid,
.ctc-fld input:user-invalid,
.ctc-fld select:user-invalid,
.ctc-fld textarea:user-invalid {
    border-color: #b3261e;
}

.abyat-fld input[type="tel"],
.abt-fld input[type="tel"],
.svcl-fld input[type="tel"],
.svcp-fld input[type="tel"],
.gal-fld input[type="tel"],
.city-fld input[type="tel"],
.catl-fld input[type="tel"],
.catp-fld input[type="tel"],
.artl-fld input[type="tel"],
.artp-fld input[type="tel"],
.ctc-fld input[type="tel"] {
    direction: ltr;
    text-align: right;
}

.abyat-fld select,
.abt-fld select,
.svcl-fld select,
.svcp-fld select,
.gal-fld select,
.city-fld select,
.catl-fld select,
.catp-fld select,
.artl-fld select,
.artp-fld select,
.ctc-fld select {
    appearance: none;
    -webkit-appearance: none;
    padding-inline-end: 2.8rem;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231f6b4a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left 1rem center;
    background-size: 16px;
}

.abyat-fld select option,
.abt-fld select option,
.svcl-fld select option,
.svcp-fld select option,
.gal-fld select option,
.city-fld select option,
.catl-fld select option,
.catp-fld select option,
.artl-fld select option,
.artp-fld select option,
.ctc-fld select option {
    color: var(--ink);
}

.abyat-fld textarea,
.abt-fld textarea,
.svcl-fld textarea,
.svcp-fld textarea,
.gal-fld textarea,
.city-fld textarea,
.catl-fld textarea,
.catp-fld textarea,
.artl-fld textarea,
.artp-fld textarea,
.ctc-fld textarea {
    min-height: 150px;
    resize: vertical;
    line-height: 1.8;
}

.abyat-fnote,
.abt-fnote,
.svcl-fnote,
.svcp-fnote,
.gal-fnote,
.city-fnote,
.catl-fnote,
.catp-fnote,
.artl-fnote,
.artp-fnote,
.ctc-fnote {
    margin: 1.1rem 0 0;
    color: var(--mute);
    font-size: 0.85rem;
}

.abyat-cform .abyat-mbtn,
.abt-cform .abt-mbtn,
.svcl-cform .svcl-mbtn,
.svcp-cform .svcp-mbtn,
.gal-cform .gal-mbtn,
.city-cform .city-mbtn,
.catl-cform .catl-mbtn,
.catp-cform .catp-mbtn,
.artl-cform .artl-mbtn,
.artp-cform .artp-mbtn,
.ctc-cform .ctc-mbtn {
    justify-content: center;
    width: 100%;
    margin-top: 1.2rem;
    min-height: 54px;
    border: 0;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    font-size: 1.02rem;
}

.abyat-footer,
.abt-footer,
.svcl-footer,
.svcp-footer,
.gal-footer,
.city-footer,
.catl-footer,
.catp-footer,
.artl-footer,
.artp-footer,
.ctc-footer {
    position: relative;
    overflow: hidden;
    background: linear-gradient(160deg, var(--g9), #0d2c21);
    color: #fff;
    padding-top: 72px;
}

.abyat-footer .abyat-fleaf,
.abt-footer .abt-fleaf,
.svcl-footer .svcl-fleaf,
.svcp-footer .svcp-fleaf,
.gal-footer .gal-fleaf,
.city-footer .city-fleaf,
.catl-footer .catl-fleaf,
.catp-footer .catp-fleaf,
.artl-footer .artl-fleaf,
.artp-footer .artp-fleaf,
.ctc-footer .ctc-fleaf {
    position: absolute;
    width: 380px;
    left: -90px;
    bottom: 40px;
    fill: var(--leaf);
    opacity: 0.07;
    pointer-events: none;
}

.abyat-footer :focus-visible,
.abyat-hero :focus-visible,
.abyat-nums :focus-visible,
.abyat-g-card:focus-visible,
.abyat-nav:not(.abyat-solid) :focus-visible,
.abyat-skip:focus-visible,
.abt-footer :focus-visible,
.abt-hero :focus-visible,
.abt-nums :focus-visible,
.abt-g-card:focus-visible,
.abt-nav:not(.abt-solid) :focus-visible,
.abt-skip:focus-visible,
.abt-phead :focus-visible,
.svcl-footer :focus-visible,
.svcl-hero :focus-visible,
.svcl-nums :focus-visible,
.svcl-g-card:focus-visible,
.svcl-nav:not(.svcl-solid) :focus-visible,
.svcl-skip:focus-visible,
.svcl-phead :focus-visible,
.svcp-footer :focus-visible,
.svcp-hero :focus-visible,
.svcp-nums :focus-visible,
.svcp-g-card:focus-visible,
.svcp-nav:not(.svcp-solid) :focus-visible,
.svcp-skip:focus-visible,
.svcp-phead :focus-visible,
.gal-footer :focus-visible,
.gal-hero :focus-visible,
.gal-nums :focus-visible,
.gal-g-card:focus-visible,
.gal-nav:not(.gal-solid) :focus-visible,
.gal-skip:focus-visible,
.gal-phead :focus-visible,
.city-footer :focus-visible,
.city-hero :focus-visible,
.city-nums :focus-visible,
.city-g-card:focus-visible,
.city-nav:not(.city-solid) :focus-visible,
.city-skip:focus-visible,
.city-phead :focus-visible,
.catl-footer :focus-visible,
.catl-hero :focus-visible,
.catl-nums :focus-visible,
.catl-g-card:focus-visible,
.catl-nav:not(.catl-solid) :focus-visible,
.catl-skip:focus-visible,
.catl-phead :focus-visible,
.catp-footer :focus-visible,
.catp-hero :focus-visible,
.catp-nums :focus-visible,
.catp-g-card:focus-visible,
.catp-nav:not(.catp-solid) :focus-visible,
.catp-skip:focus-visible,
.catp-phead :focus-visible,
.artl-footer :focus-visible,
.artl-hero :focus-visible,
.artl-nums :focus-visible,
.artl-g-card:focus-visible,
.artl-nav:not(.artl-solid) :focus-visible,
.artl-skip:focus-visible,
.artl-phead :focus-visible,
.artp-footer :focus-visible,
.artp-hero :focus-visible,
.artp-nums :focus-visible,
.artp-g-card:focus-visible,
.artp-nav:not(.artp-solid) :focus-visible,
.artp-skip:focus-visible,
.artp-phead :focus-visible,
.ctc-footer :focus-visible,
.ctc-hero :focus-visible,
.ctc-nums :focus-visible,
.ctc-g-card:focus-visible,
.ctc-nav:not(.ctc-solid) :focus-visible,
.ctc-skip:focus-visible,
.ctc-phead :focus-visible {
    outline-color: var(--lime);
}

.abyat-ftgrid,
.abt-ftgrid,
.svcl-ftgrid,
.svcp-ftgrid,
.gal-ftgrid,
.city-ftgrid,
.catl-ftgrid,
.catp-ftgrid,
.artl-ftgrid,
.artp-ftgrid,
.ctc-ftgrid {
    position: relative;
    display: grid;
    gap: 2.6rem;
    grid-template-columns: minmax(0, 1fr);
}
.abyat-ftgrid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.abyat-fbrand p,
.abt-fbrand p,
.svcl-fbrand p,
.svcp-fbrand p,
.gal-fbrand p,
.city-fbrand p,
.catl-fbrand p,
.catp-fbrand p,
.artl-fbrand p,
.artp-fbrand p,
.ctc-fbrand p {
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.95;
    max-width: 34ch;
}

.abyat-fbrand .abyat-logo,
.abt-fbrand .abt-logo,
.svcl-fbrand .svcl-logo,
.svcp-fbrand .svcp-logo,
.gal-fbrand .gal-logo,
.city-fbrand .city-logo,
.catl-fbrand .catl-logo,
.catp-fbrand .catp-logo,
.artl-fbrand .artl-logo,
.artp-fbrand .artp-logo,
.ctc-fbrand .ctc-logo {
    font-size: 1.4rem;
}

.abyat-fsoc,
.abt-fsoc,
.svcl-fsoc,
.svcp-fsoc,
.gal-fsoc,
.city-fsoc,
.catl-fsoc,
.catp-fsoc,
.artl-fsoc,
.artp-fsoc,
.ctc-fsoc {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 1.4rem;
}

.abyat-fsoc a,
.abt-fsoc a,
.svcl-fsoc a,
.svcp-fsoc a,
.gal-fsoc a,
.city-fsoc a,
.catl-fsoc a,
.catp-fsoc a,
.artl-fsoc a,
.artp-fsoc a,
.ctc-fsoc a {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #fff;
    transition:
        background 0.25s,
        color 0.25s,
        transform 0.25s;
}

.abyat-fsoc a:hover,
.abt-fsoc a:hover,
.svcl-fsoc a:hover,
.svcp-fsoc a:hover,
.gal-fsoc a:hover,
.city-fsoc a:hover,
.catl-fsoc a:hover,
.catp-fsoc a:hover,
.artl-fsoc a:hover,
.artp-fsoc a:hover,
.ctc-fsoc a:hover {
    background: var(--lime);
    color: var(--g9);
    transform: translateY(-3px);
}

.abyat-fsoc svg.abyat-icon,
.abt-fsoc svg.abt-i,
.svcl-fsoc svg.svcl-i,
.svcp-fsoc svg.svcp-i,
.svcp-lb-x svg,
.gal-fsoc svg.gal-i,
.city-fsoc svg.city-i,
.catl-fsoc svg.catl-i,
.catp-fsoc svg.catp-i,
.artl-fsoc svg.artl-i,
.artp-fsoc svg.artp-i,
.ctc-fsoc svg.ctc-i {
    width: 1.3rem;
    height: 1.3rem;
}

.abyat-fh,
.abt-fh,
.svcl-fh,
.svcp-fh,
.gal-fh,
.city-fh,
.catl-fh,
.catp-fh,
.artl-fh,
.artp-fh,
.ctc-fh {
    margin: 0 0 1.1rem;
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--lime);
}

.abyat-fl,
.abt-fl,
.svcl-fl,
.svcp-fl,
.gal-fl,
.city-fl,
.catl-fl,
.catp-fl,
.artl-fl,
.artp-fl,
.ctc-fl {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.15rem;
}

.abyat-fl a,
.abt-fl a,
.svcl-fl a,
.svcp-fl a,
.gal-fl a,
.city-fl a,
.catl-fl a,
.catp-fl a,
.artl-fl a,
.artp-fl a,
.ctc-fl a {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.4rem 0;
    color: rgba(255, 255, 255, 0.8);
    transition:
        color 0.2s,
        transform 0.2s;
}

.abyat-fl a::before,
.abt-fl a::before,
.svcl-fl a::before,
.svcp-fl a::before,
.gal-fl a::before,
.city-fl a::before,
.catl-fl a::before,
.catp-fl a::before,
.artl-fl a::before,
.artp-fl a::before,
.ctc-fl a::before {
    content: "";
    flex: none;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--g5);
    transition: background 0.2s;
}

.abyat-fl a:hover,
.abt-fl a:hover,
.svcl-fl a:hover,
.svcp-fl a:hover,
.gal-fl a:hover,
.city-fl a:hover,
.catl-fl a:hover,
.catp-fl a:hover,
.artl-fl a:hover,
.artp-fl a:hover,
.ctc-fl a:hover {
    color: var(--lime);
    transform: translateX(-4px);
}

.abyat-fl a:hover::before,
.abt-fl a:hover::before,
.svcl-fl a:hover::before,
.svcp-fl a:hover::before,
.gal-fl a:hover::before,
.city-fl a:hover::before,
.catl-fl a:hover::before,
.catp-fl a:hover::before,
.artl-fl a:hover::before,
.artp-fl a:hover::before,
.ctc-fl a:hover::before {
    background: var(--lime);
}

.abyat-fl .abyat-all a,
.abt-fl .abt-all a,
.svcl-fl .svcl-all a,
.svcp-fl .svcp-all a,
.gal-fl .gal-all a,
.city-fl .city-all a,
.catl-fl .catl-all a,
.catp-fl .catp-all a,
.artl-fl .artl-all a,
.artp-fl .artp-all a,
.ctc-fl .ctc-all a {
    margin-top: 0.5rem;
    color: var(--lime);
    font-weight: 700;
}

.abyat-fstack,
.abt-fstack,
.svcl-fstack,
.svcp-fstack,
.gal-fstack,
.city-fstack,
.catl-fstack,
.catp-fstack,
.artl-fstack,
.artp-fstack,
.ctc-fstack {
    display: grid;
    gap: 2.2rem;
    align-content: start;
}

.abyat-fci,
.abt-fci,
.svcl-fci,
.svcp-fci,
.gal-fci,
.city-fci,
.catl-fci,
.catp-fci,
.artl-fci,
.artp-fci,
.ctc-fci {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.45rem 0;
    color: #fff;
}

.abyat-fci .abyat-ic,
.abt-fci .abt-ic,
.svcl-fci .svcl-ic,
.svcp-fci .svcp-ic,
.gal-fci .gal-ic,
.city-fci .city-ic,
.catl-fci .catl-ic,
.catp-fci .catp-ic,
.artl-fci .artl-ic,
.artp-fci .artp-ic,
.ctc-fci .ctc-ic {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    flex: none;
    background: rgba(255, 255, 255, 0.1);
    color: var(--lime);
}

.abyat-fci small,
.abt-fci small,
.svcl-fci small,
.svcp-fci small,
.gal-fci small,
.city-fci small,
.catl-fci small,
.catp-fci small,
.artl-fci small,
.artp-fci small,
.ctc-fci small {
    display: block;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.8rem;
}

.abyat-fci strong,
.abt-fci strong,
.svcl-fci strong,
.svcp-fci strong,
.gal-fci strong,
.city-fci strong,
.catl-fci strong,
.catp-fci strong,
.artl-fci strong,
.artp-fci strong,
.ctc-fci strong {
    display: block;
    font-weight: 700;
    line-height: 1.6;
}

.abyat-fbottom,
.abt-fbottom,
.svcl-fbottom,
.svcp-fbottom,
.gal-fbottom,
.city-fbottom,
.catl-fbottom,
.catp-fbottom,
.artl-fbottom,
.artp-fbottom,
.ctc-fbottom {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem 2rem;
    margin-top: 3.2rem;
    padding: 1.3rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    font-size: 0.92rem;
    color: rgba(255, 255, 255, 0.78);
}

.abyat-flegal,
.abt-flegal,
.svcl-flegal,
.svcp-flegal,
.gal-flegal,
.city-flegal,
.catl-flegal,
.catp-flegal,
.artl-flegal,
.artp-flegal,
.ctc-flegal {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.6rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.abyat-flegal a,
.abt-flegal a,
.svcl-flegal a,
.svcp-flegal a,
.gal-flegal a,
.city-flegal a,
.catl-flegal a,
.catp-flegal a,
.artl-flegal a,
.artp-flegal a,
.ctc-flegal a {
    display: inline-block;
    padding: 0.3rem 0;
    color: rgba(255, 255, 255, 0.85);
}

.abyat-flegal a:hover,
.abt-flegal a:hover,
.svcl-flegal a:hover,
.svcp-flegal a:hover,
.gal-flegal a:hover,
.city-flegal a:hover,
.catl-flegal a:hover,
.catp-flegal a:hover,
.artl-flegal a:hover,
.artp-flegal a:hover,
.ctc-flegal a:hover {
    color: var(--lime);
    text-decoration: underline;
    text-underline-offset: 4px;
}

.abyat-fdev,
.abt-fdev,
.svcl-fdev,
.svcp-fdev,
.gal-fdev,
.city-fdev,
.catl-fdev,
.catp-fdev,
.artl-fdev,
.artp-fdev,
.ctc-fdev {
    position: relative;
    background: rgba(0, 0, 0, 0.2);
    padding: 0.9rem 0 calc(0.9rem + env(safe-area-inset-bottom, 0px));
    text-align: center;
}

.abyat-devpill,
.abt-devpill,
.svcl-devpill,
.svcp-devpill,
.gal-devpill,
.city-devpill,
.catl-devpill,
.catp-devpill,
.artl-devpill,
.artp-devpill,
.ctc-devpill {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 44px;
    padding: 0.3rem 1.05rem 0.3rem 0.35rem;
    border-radius: 99px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.88rem;
    transition:
        background 0.25s,
        border-color 0.25s,
        transform 0.25s;
}

.abyat-devpill strong,
.abt-devpill strong,
.svcl-devpill strong,
.svcp-devpill strong,
.gal-devpill strong,
.city-devpill strong,
.catl-devpill strong,
.catp-devpill strong,
.artl-devpill strong,
.artp-devpill strong,
.ctc-devpill strong {
    color: var(--lime);
    font-weight: 800;
}

.abyat-devpill .abyat-wi,
.abt-devpill .abt-wi,
.svcl-devpill .svcl-wi,
.svcp-devpill .svcp-wi,
.gal-devpill .gal-wi,
.city-devpill .city-wi,
.catl-devpill .catl-wi,
.catp-devpill .catp-wi,
.artl-devpill .artl-wi,
.artp-devpill .artp-wi,
.ctc-devpill .ctc-wi {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #0f7a3f;
    color: #fff;
    flex: none;
}

.abyat-devpill .abyat-wi svg.abyat-icon,
.abt-devpill .abt-wi svg.abt-i,
.svcl-devpill .svcl-wi svg.svcl-i,
.svcp-devpill .svcp-wi svg.svcp-i,
.gal-devpill .gal-wi svg.gal-i,
.city-devpill .city-wi svg.city-i,
.catl-devpill .catl-wi svg.catl-i,
.catp-devpill .catp-wi svg.catp-i,
.artl-devpill .artl-wi svg.artl-i,
.artp-devpill .artp-wi svg.artp-i,
.artp-sb svg.artp-i,
.ctc-devpill .ctc-wi svg.ctc-i {
    width: 1.15rem;
    height: 1.15rem;
}

.abyat-devpill:hover,
.abt-devpill:hover,
.svcl-devpill:hover,
.svcp-devpill:hover,
.gal-devpill:hover,
.city-devpill:hover,
.catl-devpill:hover,
.catp-devpill:hover,
.artl-devpill:hover,
.artp-devpill:hover,
.ctc-devpill:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: var(--lime);
    transform: translateY(-2px);
}

.abyat-nav,
.abt-nav,
.svcl-nav,
.svcp-nav,
.gal-nav,
.city-nav,
.catl-nav,
.catp-nav,
.artl-nav,
.artp-nav,
.ctc-nav {
    position: fixed;
    top: calc(12px + env(safe-area-inset-top, 0px));
    inset-inline: 0;
    margin-inline: auto;
    width: min(1350px, calc(100% - 24px));
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.6rem 0.9rem 0.6rem 1rem;
    border-radius: 22px;
    background: #ffffff14;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(12px);
    color: var(--glassTxt);
    border: 1px solid rgba(255, 255, 255, 0.18);
    transition:
        background 0.3s,
        color 0.3s,
        box-shadow 0.3s,
        border-color 0.3s;
}

.abyat-nav.abyat-solid,
.abt-nav.abt-solid,
.svcl-nav.svcl-solid,
.svcp-nav.svcp-solid,
.gal-nav.gal-solid,
.city-nav.city-solid,
.catl-nav.catl-solid,
.catp-nav.catp-solid,
.artl-nav.artl-solid,
.artp-nav.artp-solid,
.ctc-nav.ctc-solid {
    background: #fff;
    color: var(--ink);
    border-color: var(--line);
    box-shadow: 0 8px 28px rgba(var(--g9-rgb), 0.12);
}

.abyat-logo,
.abt-logo,
.svcl-logo,
.svcp-logo,
.gal-logo,
.city-logo,
.catl-logo,
.catp-logo,
.artl-logo,
.artp-logo,
.ctc-logo {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-weight: 800;
    font-size: 1.25rem;
    white-space: nowrap;
}

.abyat-logo .abyat-mark,
.abt-logo .abt-mark,
.svcl-logo .svcl-mark,
.svcp-logo .svcp-mark,
.gal-logo .gal-mark,
.city-logo .city-mark,
.catl-logo .catl-mark,
.catp-logo .catp-mark,
.artl-logo .artl-mark,
.artp-logo .artp-mark,
.ctc-logo .ctc-mark {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-items: center;
    font-size: 1.2rem;
}

.abyat-links,
.abt-links,
.svcl-links,
.svcp-links,
.gal-links,
.city-links,
.catl-links,
.catp-links,
.artl-links,
.artp-links,
.ctc-links {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.15rem;
}

.abyat-links a,
.abt-links a,
.svcl-links a,
.svcp-links a,
.gal-links a,
.city-links a,
.catl-links a,
.catp-links a,
.artl-links a,
.artp-links a,
.ctc-links a {
    display: block;
    padding: 0.5rem 0.8rem;
    border-radius: 12px;
    font-weight: 500;
    font-size: 0.95rem;
    transition:
        background 0.2s,
        color 0.2s;
}

.abyat-links a:hover,
.abt-links a:hover,
.svcl-links a:hover,
.svcp-links a:hover,
.gal-links a:hover,
.city-links a:hover,
.catl-links a:hover,
.catp-links a:hover,
.artl-links a:hover,
.artp-links a:hover,
.ctc-links a:hover {
    background: rgba(255, 255, 255, 0.16);
}

.abyat-links a.abyat-on,
.abt-links a.abt-on,
.svcl-links a.svcl-on,
.svcp-links a.svcp-on,
.gal-links a.gal-on,
.city-links a.city-on,
.catl-links a.catl-on,
.catp-links a.catp-on,
.artl-links a.artl-on,
.artp-links a.artp-on,
.ctc-links a.ctc-on {
    background: rgba(255, 255, 255, 0.2);
    font-weight: 700;
}

.abyat-nav.abyat-solid .abyat-links a.abyat-on,
.abyat-item.abyat-on,
.abt-nav.abt-solid .abt-links a.abt-on,
.abt-item.abt-on,
.svcl-nav.svcl-solid .svcl-links a.svcl-on,
.svcl-item.svcl-on,
.svcp-nav.svcp-solid .svcp-links a.svcp-on,
.svcp-item.svcp-on,
.gal-nav.gal-solid .gal-links a.gal-on,
.gal-item.gal-on,
.city-nav.city-solid .city-links a.city-on,
.city-item.city-on,
.catl-nav.catl-solid .catl-links a.catl-on,
.catl-item.catl-on,
.catp-nav.catp-solid .catp-links a.catp-on,
.catp-item.catp-on,
.artl-nav.artl-solid .artl-links a.artl-on,
.artl-item.artl-on,
.artp-nav.artp-solid .artp-links a.artp-on,
.artp-item.artp-on,
.artp-sb-copy.artp-done,
.artp-ar-back:hover,
.ctc-nav.ctc-solid .ctc-links a.ctc-on,
.ctc-item.ctc-on {
    background: var(--g7);
    color: #fff;
}

.abyat-cta,
.abt-cta,
.svcl-cta,
.svcp-cta,
.gal-cta,
.city-cta,
.catl-cta,
.catp-cta,
.artl-cta,
.artp-cta,
.ctc-cta {
    display: none;
    align-items: center;
    gap: 0.5rem;
    background: var(--lime);
    color: var(--g9);
    font-weight: 700;
    padding: 0.6rem 1.1rem;
    border-radius: 14px;
    white-space: nowrap;
}

.abyat-burger,
.abt-burger,
.svcl-burger,
.svcp-burger,
.gal-burger,
.city-burger,
.catl-burger,
.catp-burger,
.artl-burger,
.artp-burger,
.ctc-burger {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    border: 0;
    background: rgba(255, 255, 255, 0.18);
    color: inherit;
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    cursor: pointer;
}

.abyat-scrim,
.abt-scrim,
.svcl-scrim,
.svcp-scrim,
.gal-scrim,
.city-scrim,
.catl-scrim,
.catp-scrim,
.artl-scrim,
.artp-scrim,
.ctc-scrim {
    position: fixed;
    inset: 0;
    background: rgba(var(--g9-rgb), 0.55);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s;
    z-index: 60;
}

.abyat-drawer,
.abt-drawer,
.svcl-drawer,
.svcp-drawer,
.gal-drawer,
.city-drawer,
.catl-drawer,
.catp-drawer,
.artl-drawer,
.artp-drawer,
.ctc-drawer {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    width: min(360px, 88vw);
    background: #fff;
    z-index: 61;
    transform: translateX(100%);
    visibility: hidden;
    transition:
        transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1),
        visibility 0s 0.35s;
    display: flex;
    flex-direction: column;
    border-radius: 24px 0 0 24px;
    padding-top: env(safe-area-inset-top, 0px);
}

.abyat-open .abyat-scrim,
.abt-open .abt-scrim,
.svcl-open .svcl-scrim,
.svcp-open .svcp-scrim,
.gal-open .gal-scrim,
.city-open .city-scrim,
.catl-open .catl-scrim,
.catp-open .catp-scrim,
.artl-open .artl-scrim,
.artp-open .artp-scrim,
.ctc-open .ctc-scrim {
    opacity: 1;
    pointer-events: auto;
}

.abyat-open .abyat-drawer,
.abt-open .abt-drawer,
.svcl-open .svcl-drawer,
.svcp-open .svcp-drawer,
.gal-open .gal-drawer,
.city-open .city-drawer,
.catl-open .catl-drawer,
.catp-open .catp-drawer,
.artl-open .artl-drawer,
.artp-open .artp-drawer,
.ctc-open .ctc-drawer {
    transform: none;
    visibility: visible;
    transition-delay: 0s;
}

.abyat-dh,
.abt-dh,
.svcl-dh,
.svcp-dh,
.gal-dh,
.city-dh,
.catl-dh,
.catp-dh,
.artl-dh,
.artp-dh,
.ctc-dh {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--line);
}

.abyat-dh .abyat-logo .abyat-mark,
.abt-dh .abt-logo .abt-mark,
.svcl-dh .svcl-logo .svcl-mark,
.svcp-dh .svcp-logo .svcp-mark,
.gal-dh .gal-logo .gal-mark,
.gal-lb-media .gal-pl svg,
.city-dh .city-logo .city-mark,
.catl-dh .catl-logo .catl-mark,
.catp-dh .catp-logo .catp-mark,
.artl-dh .artl-logo .artl-mark,
.artp-dh .artp-logo .artp-mark,
.ctc-dh .ctc-logo .ctc-mark {
    width: 40px;
    height: 40px;
}

.abyat-btn-close,
.abt-x,
.svcl-x,
.svcp-x,
.gal-x,
.city-x,
.catl-x,
.catp-x,
.artl-x,
.artp-x,
.ctc-x {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 12px;
    background: var(--chip);
    cursor: pointer;
    display: grid;
    place-items: center;
    color: var(--ink);
}

.abyat-db,
.abt-db,
.svcl-db,
.svcp-db,
.gal-db,
.city-db,
.catl-db,
.catp-db,
.artl-db,
.artp-db,
.ctc-db {
    overflow: auto;
    padding: 0.4rem 1.1rem 1.2rem;
    flex: 1;
}

.abyat-sec,
.abt-sec,
.svcl-sec,
.svcp-sec,
.gal-sec,
.city-sec,
.catl-sec,
.catp-sec,
.artl-sec,
.artp-sec,
.ctc-sec {
    padding: 1rem 0;
    border-bottom: 1px solid var(--line);
}

.abyat-sec:last-child,
.abt-sec:last-child,
.svcl-sec:last-child,
.svcp-sec:last-child,
.gal-sec:last-child,
.city-sec:last-child,
.catl-sec:last-child,
.catp-sec:last-child,
.artl-sec:last-child,
.artp-sec:last-child,
.ctc-sec:last-child {
    border: 0;
}

.abyat-sec .abyat-st,
.abt-sec .abt-st,
.svcl-sec .svcl-st,
.svcp-sec .svcp-st,
.gal-sec .gal-st,
.city-sec .city-st,
.catl-sec .catl-st,
.catp-sec .catp-st,
.artl-sec .artl-st,
.artp-sec .artp-st,
.ctc-sec .ctc-st {
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--g7);
    margin: 0 0 0.6rem;
}

.abyat-item,
.abt-item,
.svcl-item,
.svcp-item,
.gal-item,
.city-item,
.catl-item,
.catp-item,
.artl-item,
.artp-item,
.ctc-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    border-radius: 12px;
    margin-bottom: 0.4rem;
    font-weight: 500;
    font-size: 0.96rem;
    border: 1px solid #8080801c;
}

.abyat-item .abyat-ic,
.abt-item .abt-ic,
.svcl-item .svcl-ic,
.svcp-item .svcp-ic,
.gal-item .gal-ic,
.city-item .city-ic,
.catl-item .catl-ic,
.catp-item .catp-ic,
.artl-item .artl-ic,
.artp-item .artp-ic,
.ctc-item .ctc-ic {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: var(--g7);
    display: grid;
    place-items: center;
    flex: none;
    color: white;
}

.abyat-item.abyat-on .abyat-ic,
.abt-item.abt-on .abt-ic,
.svcl-item.svcl-on .svcl-ic,
.svcp-item.svcp-on .svcp-ic,
.gal-item.gal-on .gal-ic,
.city-item.city-on .city-ic,
.catl-item.catl-on .catl-ic,
.catp-item.catp-on .catp-ic,
.artl-item.artl-on .artl-ic,
.artp-item.artp-on .artp-ic,
.ctc-item.ctc-on .ctc-ic {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
}

.abyat-rate,
.abt-rate,
.svcl-rate,
.svcp-rate,
.gal-rate,
.city-rate,
.catl-rate,
.catp-rate,
.artl-rate,
.artp-rate,
.ctc-rate {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    background: var(--g9);
    color: #fff;
    border-radius: 14px;
    padding: 0.8rem 1rem;
}

.abyat-rate b,
.abt-rate b,
.svcl-rate b,
.svcp-rate b,
.gal-rate b,
.city-rate b,
.catl-rate b,
.catp-rate b,
.artl-rate b,
.artp-rate b,
.ctc-rate b {
    font-size: 1.7rem;
    color: var(--lime);
    line-height: 1;
}

.abyat-rate small,
.abt-rate small,
.svcl-rate small,
.svcp-rate small,
.gal-rate small,
.city-rate small,
.catl-rate small,
.catp-rate small,
.artl-rate small,
.artp-rate small,
.ctc-rate small {
    opacity: 0.7;
}

.abyat-stars,
.abt-stars,
.svcl-stars,
.svcp-stars,
.gal-stars,
.city-stars,
.catl-stars,
.catp-stars,
.artl-stars,
.artp-stars,
.ctc-stars {
    color: var(--star);
    display: flex;
    gap: 2px;
    font-size: 0.9rem;
}

.abyat-info,
.abt-info,
.svcl-info,
.svcp-info,
.gal-info,
.city-info,
.catl-info,
.catp-info,
.artl-info,
.artp-info,
.ctc-info {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.55rem;
    font-size: 0.95rem;
    margin: 5px 0;
    border-radius: 10px;
    border: 1px solid #8080801c;
}

.abyat-info .abyat-ic,
.abt-info .abt-ic,
.svcl-info .svcl-ic,
.svcp-info .svcp-ic,
.gal-info .gal-ic,
.city-info .city-ic,
.catl-info .catl-ic,
.catp-info .catp-ic,
.artl-info .artl-ic,
.artp-info .artp-ic,
.ctc-info .ctc-ic {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--g7);
    color: white;
    display: grid;
    place-items: center;
    flex: none;
}

.abyat-info small,
.abt-info small,
.svcl-info small,
.svcp-info small,
.gal-info small,
.city-info small,
.catl-info small,
.catp-info small,
.artl-info small,
.artp-info small,
.ctc-info small {
    display: block;
    color: var(--mute);
    font-size: 0.78rem;
}

.abyat-info span.abyat-num,
.abt-info span.abt-num,
.svcl-info span.svcl-num,
.svcp-info span.svcp-num,
.gal-info span.gal-num,
.city-info span.city-num,
.catl-info span.catl-num,
.catp-info span.catp-num,
.artl-info span.artl-num,
.artp-info span.artp-num,
.ctc-info span.ctc-num {
    direction: ltr;
    unicode-bidi: embed;
    display: inline-block;
}

.abyat-drawer .abyat-sec:first-child {
    border: 0;
}

.abyat-drawer .abyat-item {
    gap: 0.8rem;
    min-height: 52px;
    padding: 0.55rem 0.7rem;
    border: 0;
    border-radius: 14px;
    margin-bottom: 0.25rem;
    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}

.abyat-drawer .abyat-item-label {
    flex: 1;
}

.abyat-drawer .abyat-item-arrow {
    width: 18px;
    height: 18px;
    flex: none;
    color: var(--g5);
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    transition:
        transform 0.2s ease,
        color 0.2s ease;
}

.abyat-drawer .abyat-item:hover,
.abyat-drawer .abyat-item:focus-visible {
    background: var(--chip);
}

.abyat-drawer .abyat-item:hover .abyat-item-arrow,
.abyat-drawer .abyat-item:focus-visible .abyat-item-arrow {
    color: var(--g7);
    transform: translateX(-3px);
}

.abyat-drawer .abyat-item.abyat-on {
    background: var(--g9);
    color: #fff;
}

.abyat-drawer .abyat-item.abyat-on .abyat-item-arrow {
    color: #b7e35a;
}

.abyat-drawer .abyat-sec:has(> .abyat-info) {
    padding-top: 0.75rem;
    border: 0;
}

.abyat-drawer .abyat-info {
    min-width: 0;
    gap: 0.85rem;
    padding: 0.8rem;
    margin: 0.55rem 0;
    border: 1px solid rgba(var(--g9-rgb), 0.07);
    border-radius: 16px;
    background: linear-gradient(135deg, #f8fbf6, #fff);
    box-shadow: 0 5px 16px rgba(var(--g9-rgb), 0.05);
    color: var(--ink);
    text-decoration: none;
}

.abyat-drawer a.abyat-info {
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}

.abyat-drawer a.abyat-info:hover {
    border-color: rgba(31, 107, 74, 0.22);
    box-shadow: 0 8px 20px rgba(var(--g9-rgb), 0.09);
    transform: translateY(-1px);
}

.abyat-drawer .abyat-info .abyat-ic {
    width: 40px;
    height: 40px;
    border-radius: 13px;
    background: #e8f2e7;
    color: var(--g7);
}

.abyat-drawer .abyat-info > div {
    min-width: 0;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.abyat-drawer .abyat-info small {
    margin-bottom: 0.12rem;
    font-weight: 600;
}

.abyat-drawer .abyat-info span.abyat-num {
    font-weight: 700;
    color: var(--g9);
}

.abyat-soc,
.abt-soc,
.svcl-soc,
.svcp-soc,
.gal-soc,
.city-soc,
.catl-soc,
.catp-soc,
.artl-soc,
.artp-soc,
.ctc-soc {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    margin-top: 0.2rem;
}

.abyat-soc a,
.abt-soc a,
.svcl-soc a,
.svcp-soc a,
.gal-soc a,
.city-soc a,
.catl-soc a,
.catp-soc a,
.artl-soc a,
.artp-soc a,
.ctc-soc a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    padding: 0.7rem 0.3rem;
    border-radius: 14px;
    color: #fff;
    font-size: 0.82rem;
    font-weight: 700;
}

.abyat-ig,
.abt-ig,
.svcl-ig,
.svcp-ig,
.gal-ig,
.city-ig,
.catl-ig,
.catp-ig,
.artl-ig,
.artp-ig,
.ctc-ig {
    background: linear-gradient(45deg, #f9a03f, #dd2a7b 55%, #8134af);
}

.abyat-wa,
.abyat-fab-wa,
.abt-wa,
.abt-fab-wa,
.svcl-wa,
.svcl-fab-wa,
.svcp-wa,
.svcp-fab-wa,
.gal-wa,
.gal-fab-wa,
.city-wa,
.city-fab-wa,
.catl-wa,
.catl-fab-wa,
.catp-wa,
.catp-fab-wa,
.artl-wa,
.artl-fab-wa,
.artp-wa,
.artp-fab-wa,
.ctc-wa,
.ctc-fab-wa {
    background: #25d366;
}

.abyat-drawer :focus-visible,
.abt-drawer :focus-visible,
.svcl-drawer :focus-visible,
.svcp-drawer :focus-visible,
.gal-drawer :focus-visible,
.city-drawer :focus-visible,
.catl-drawer :focus-visible,
.catp-drawer :focus-visible,
.artl-drawer :focus-visible,
.artp-drawer :focus-visible,
.ctc-drawer :focus-visible {
    outline-color: var(--g7);
}

.abyat-fab,
.abt-fab,
.svcl-fab,
.svcp-fab,
.gal-fab,
.city-fab,
.catl-fab,
.catp-fab,
.artl-fab,
.artp-fab,
.ctc-fab {
    position: fixed;
    right: 16px;
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    z-index: 45;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.abyat-fab {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(10px);
    transition:
        opacity 0.3s ease,
        transform 0.3s ease,
        visibility 0s linear 0.3s;
}

.abyat-fab.abyat-fab-show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
    transition:
        opacity 0.3s ease,
        transform 0.3s ease,
        visibility 0s;
}

.abyat-fab-b,
.abyat-totop,
.abt-fab-b,
.abt-totop,
.svcl-fab-b,
.svcl-totop,
.svcp-fab-b,
.svcp-totop,
.gal-fab-b,
.gal-totop,
.city-fab-b,
.city-totop,
.catl-fab-b,
.catl-totop,
.catp-fab-b,
.catp-totop,
.artl-fab-b,
.artl-totop,
.artp-fab-b,
.artp-totop,
.ctc-fab-b,
.ctc-totop {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    border: 0;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(var(--g9-rgb), 0.3);
    font-size: 1.5rem;
    transition:
        transform 0.2s,
        filter 0.2s;
}

.abyat-fab-b:hover,
.abyat-totop:hover,
.abt-fab-b:hover,
.abt-totop:hover,
.svcl-fab-b:hover,
.svcl-totop:hover,
.svcp-fab-b:hover,
.svcp-totop:hover,
.gal-fab-b:hover,
.gal-totop:hover,
.city-fab-b:hover,
.city-totop:hover,
.catl-fab-b:hover,
.catl-totop:hover,
.catp-fab-b:hover,
.catp-totop:hover,
.artl-fab-b:hover,
.artl-totop:hover,
.artp-fab-b:hover,
.artp-totop:hover,
.ctc-fab-b:hover,
.ctc-totop:hover {
    transform: translateY(-3px);
    filter: brightness(0.95);
}

.abyat-fab-call {
    background: var(--g7);
    position: relative;
    animation: abyat-kf-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.abyat-fab-call::before,
.abyat-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: abyat-kf-ripple 2.6s ease-out infinite;
}

.abyat-fab-call::after,
.abt-fab-call::after,
.svcl-fab-call::after,
.svcp-fab-call::after,
.gal-fab-call::after,
.city-fab-call::after,
.catl-fab-call::after,
.catp-fab-call::after,
.artl-fab-call::after,
.artp-fab-call::after,
.ctc-fab-call::after {
    animation-delay: 0.35s;
}

.abyat-totop,
.abt-totop,
.svcl-totop,
.svcp-totop,
.gal-totop,
.city-totop,
.catl-totop,
.catp-totop,
.artl-totop,
.artp-totop,
.ctc-totop {
    position: fixed;
    left: 16px;
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    z-index: 45;
    background: var(--g9);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition:
        opacity 0.3s,
        transform 0.3s,
        visibility 0s 0.3s;
}

.abyat-totop.abyat-show,
.abt-totop.abt-show,
.svcl-totop.svcl-show,
.svcp-totop.svcp-show,
.gal-totop.gal-show,
.city-totop.city-show,
.catl-totop.catl-show,
.catp-totop.catp-show,
.artl-totop.artl-show,
.artp-totop.artp-show,
.ctc-totop.ctc-show {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition:
        opacity 0.3s,
        transform 0.3s;
}

.abyat-totop.abyat-show:hover,
.abt-totop.abt-show:hover,
.svcl-totop.svcl-show:hover,
.svcp-totop.svcp-show:hover,
.gal-totop.gal-show:hover,
.city-totop.city-show:hover,
.catl-totop.catl-show:hover,
.catp-totop.catp-show:hover,
.artl-totop.artl-show:hover,
.artp-totop.artp-show:hover,
.ctc-totop.ctc-show:hover {
    transform: translateY(-3px);
}

.abyat-totop svg,
.abt-totop svg,
.svcl-totop svg,
.svcp-totop svg,
.gal-totop svg,
.city-totop svg,
.catl-totop svg,
.catp-totop svg,
.artl-totop svg,
.artp-totop svg,
.ctc-totop svg {
    stroke-width: 2.2;
}

.abyat-nav-prog,
.abt-nav-prog,
.svcl-nav-prog,
.svcp-nav-prog,
.gal-nav-prog,
.city-nav-prog,
.catl-nav-prog,
.catp-nav-prog,
.artl-nav-prog,
.artp-nav-prog,
.ctc-nav-prog {
    position: absolute;
    inset-inline: 22px;
    bottom: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: var(--lime);
    transform: scaleX(0);
    transform-origin: right center;
    pointer-events: none;
    transition: background 0.3s;
}

.abyat-nav.abyat-solid .abyat-nav-prog,
.abt-nav.abt-solid .abt-nav-prog,
.svcl-nav.svcl-solid .svcl-nav-prog,
.svcp-nav.svcp-solid .svcp-nav-prog,
.gal-nav.gal-solid .gal-nav-prog,
.city-nav.city-solid .city-nav-prog,
.catl-nav.catl-solid .catl-nav-prog,
.catp-nav.catp-solid .catp-nav-prog,
.artl-nav.artl-solid .artl-nav-prog,
.artp-nav.artp-solid .artp-nav-prog,
.ctc-nav.ctc-solid .ctc-nav-prog {
    background: var(--g7);
}

.abt-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: abt-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.abt-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: abt-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.abt-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: abt-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.abt-fab-call {
    background: var(--g7);
    position: relative;
    animation: abt-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.abt-fab-call::before,
.abt-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: abt-ripple 2.6s ease-out infinite;
}

.abt-phead,
.svcl-phead,
.svcp-phead,
.gal-phead,
.city-phead,
.catl-phead,
.catp-phead,
.artl-phead,
.artp-phead,
.ctc-phead {
    position: relative;
    overflow: hidden;
    color: #fff;
    padding: 150px 0 90px;
    background:
        radial-gradient(50% 70% at 15% 95%, var(--g5), transparent),
        linear-gradient(160deg, var(--g9), var(--g7));
    border-radius: 0 0 44px 44px;
}

.abt-phead .abt-cw,
.svcl-phead .svcl-cw,
.svcp-phead .svcp-cw,
.gal-phead .gal-cw,
.city-phead .city-cw,
.catl-phead .catl-cw,
.catp-phead .catp-cw,
.artl-phead .artl-cw,
.artp-phead .artp-cw,
.ctc-phead .ctc-cw {
    position: relative;
    z-index: 2;
}

.abt-crumb,
.svcl-crumb,
.svcp-crumb,
.gal-crumb,
.city-crumb,
.catl-crumb,
.catp-crumb,
.artl-crumb,
.artp-crumb,
.ctc-crumb {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.92rem;
    opacity: 0.9;
    margin-bottom: 1.2rem;
}

.abt-phead h1,
.svcl-phead h1,
.svcp-phead h1,
.gal-phead h1,
.city-phead h1,
.catl-phead h1,
.catp-phead h1,
.artl-phead h1,
.artp-phead h1,
.ctc-phead h1 {
    font-size: clamp(2.2rem, 5.5vw, 3.8rem);
    line-height: 1.25;
    font-weight: 800;
    margin: 0 0 1rem;
}

.abt-phead p,
.svcl-phead p,
.svcp-phead p,
.gal-phead p,
.city-phead p,
.catl-phead p,
.catp-phead p,
.artl-phead p,
.artp-phead p,
.ctc-phead p {
    max-width: 58ch;
    font-size: 1.1rem;
    line-height: 1.9;
    opacity: 0.92;
    margin: 0;
}

.abt-g3,
.svcl-g3,
.svcp-g3,
.gal-g3,
.city-g3,
.catl-g3,
.catp-g3,
.artl-g3,
.artp-g3,
.ctc-g3 {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}

.abt-pc,
.svcl-pc,
.svcp-pc,
.gal-pc,
.city-pc,
.catl-pc,
.catp-pc,
.artl-pc,
.artp-pc,
.ctc-pc {
    --ac: var(--c1);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 2rem;
    transition:
        transform 0.35s,
        box-shadow 0.35s;
}

.abt-pc .abt-ic,
.svcl-pc .svcl-ic,
.svcp-pc .svcp-ic,
.gal-pc .gal-ic,
.city-pc .city-ic,
.catl-pc .catl-ic,
.catp-pc .catp-ic,
.artl-pc .artl-ic,
.artp-pc .artp-ic,
.ctc-pc .ctc-ic {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    background: color-mix(in srgb, var(--ac) 14%, #fff);
    color: var(--ac);
    display: grid;
    place-items: center;
    font-size: 1.6rem;
    margin-bottom: 1.1rem;
}

.abt-pc h3,
.svcl-pc h3,
.svcp-pc h3,
.gal-pc h3,
.city-pc h3,
.catl-pc h3,
.catp-pc h3,
.artl-pc h3,
.artp-pc h3,
.ctc-pc h3 {
    margin: 0 0 0.5rem;
    font-size: 1.35rem;
    font-weight: 800;
}

.abt-pc p,
.svcl-pc p,
.svcp-pc p,
.gal-pc p,
.city-pc p,
.catl-pc p,
.catp-pc p,
.artl-pc p,
.artp-pc p,
.ctc-pc p {
    margin: 0;
    color: var(--mute);
    line-height: 1.95;
}

.abt-stp,
.svcl-stp,
.svcp-stp,
.gal-stp,
.city-stp,
.catl-stp,
.catp-stp,
.artl-stp,
.artp-stp,
.ctc-stp {
    position: relative;
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 1.7rem 1.5rem;
}

.abt-stp b,
.svcl-stp b,
.svcp-stp b,
.gal-stp b,
.city-stp b,
.catl-stp b,
.catp-stp b,
.artl-stp b,
.artp-stp b,
.ctc-stp b {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    font-size: 1.2rem;
    font-weight: 800;
    margin-bottom: 1rem;
}

.abt-stp h3,
.svcl-stp h3,
.svcp-stp h3,
.gal-stp h3,
.city-stp h3,
.catl-stp h3,
.catp-stp h3,
.artl-stp h3,
.artp-stp h3,
.ctc-stp h3 {
    margin: 0 0 0.4rem;
    font-size: 1.15rem;
    font-weight: 800;
}

.abt-stp p,
.svcl-stp p,
.svcp-stp p,
.gal-stp p,
.city-stp p,
.catl-stp p,
.catp-stp p,
.artl-stp p,
.artp-stp p,
.ctc-stp p {
    margin: 0;
    color: var(--mute);
    line-height: 1.9;
    font-size: 0.96rem;
}

.abt-cbox,
.svcl-cbox,
.svcp-cbox,
.gal-cbox,
.city-cbox,
.catl-cbox,
.catp-cbox,
.artl-cbox,
.artp-cbox,
.ctc-cbox {
    position: relative;
    overflow: hidden;
    border-radius: 32px;
    background: linear-gradient(135deg, var(--g9), var(--g7));
    color: #fff;
    text-align: center;
    padding: 3.5rem 1.5rem;
}

.abt-cbox > svg,
.svcl-cbox > svg,
.svcp-cbox > svg,
.gal-cbox > svg,
.city-cbox > svg,
.catl-cbox > svg,
.catp-cbox > svg,
.artl-cbox > svg,
.artp-cbox > svg,
.ctc-cbox > svg {
    position: absolute;
    width: 340px;
    left: -70px;
    bottom: -110px;
    fill: var(--leaf);
    opacity: 0.12;
}

.abt-cbox h2,
.svcl-cbox h2,
.svcp-cbox h2,
.gal-cbox h2,
.city-cbox h2,
.catl-cbox h2,
.catp-cbox h2,
.artl-cbox h2,
.artp-cbox h2,
.ctc-cbox h2 {
    color: #fff;
    margin: 0 0 0.7rem;
}

.abt-cbox p,
.svcl-cbox p,
.svcp-cbox p,
.gal-cbox p,
.city-cbox p,
.catl-cbox p,
.catp-cbox p,
.artl-cbox p,
.artp-cbox p,
.ctc-cbox p {
    margin: 0 auto 1.8rem;
    max-width: 52ch;
    opacity: 0.9;
    line-height: 1.9;
}

.abt-cbox .abt-bt,
.svcl-cbox .svcl-bt,
.svcp-cbox .svcp-bt,
.gal-cbox .gal-bt,
.city-cbox .city-bt,
.catl-cbox .catl-bt,
.catp-cbox .catp-bt,
.artl-cbox .artl-bt,
.artp-cbox .artp-bt,
.ctc-cbox .ctc-bt {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    justify-content: center;
}

.abt-mbtn.abt-lime:hover,
.svcl-mbtn.svcl-lime:hover,
.svcp-mbtn.svcp-lime:hover,
.gal-mbtn.gal-lime:hover,
.city-mbtn.city-lime:hover,
.catl-mbtn.catl-lime:hover,
.catp-mbtn.catp-lime:hover,
.artl-mbtn.artl-lime:hover,
.artp-mbtn.artp-lime:hover,
.ctc-mbtn.ctc-lime:hover {
    background: var(--lime);
    filter: brightness(0.95);
}

.abt-mbtn.abt-ghost,
.svcl-mbtn.svcl-ghost,
.svcp-mbtn.svcp-ghost,
.gal-mbtn.gal-ghost,
.city-mbtn.city-ghost,
.catl-mbtn.catl-ghost,
.catp-mbtn.catp-ghost,
.artl-mbtn.artl-ghost,
.artp-mbtn.artp-ghost,
.ctc-mbtn.ctc-ghost {
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.svcl-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: svcl-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.svcl-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: svcl-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.svcl-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: svcl-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.svcl-fab-call {
    background: var(--g7);
    position: relative;
    animation: svcl-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.svcl-fab-call::before,
.svcl-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: svcl-ripple 2.6s ease-out infinite;
}

.svcl-mapbox,
.svcp-mapbox,
.gal-mapbox,
.city-mapbox,
.catl-mapbox,
.catp-mapbox,
.artl-mapbox,
.artp-mapbox,
.ctc-mapbox {
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    min-height: 300px;
    display: grid;
    place-items: center;
    text-align: center;
    color: #fff;
    padding: 2.2rem 1.5rem;
    background:
        radial-gradient(60% 70% at 75% 25%, var(--g5), transparent),
        linear-gradient(160deg, var(--g9), var(--g7));
}

.svcl-mapbox > svg,
.svcp-mapbox > svg,
.gal-mapbox > svg,
.city-mapbox > svg,
.catl-mapbox > svg,
.catp-mapbox > svg,
.artl-mapbox > svg,
.artp-mapbox > svg,
.ctc-mapbox > svg {
    position: absolute;
    width: 300px;
    right: -60px;
    bottom: -90px;
    fill: var(--leaf);
    opacity: 0.12;
}

.svcl-mapbox .svcl-pin,
.svcp-mapbox .svcp-pin,
.gal-mapbox .gal-pin,
.city-mapbox .city-pin,
.catl-mapbox .catl-pin,
.catp-mapbox .catp-pin,
.artl-mapbox .artl-pin,
.artp-mapbox .artp-pin,
.ctc-mapbox .ctc-pin {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-items: center;
    font-size: 1.7rem;
    margin: 0 auto 1rem;
}

.svcl-mapbox h3,
.svcp-mapbox h3,
.gal-mapbox h3,
.city-mapbox h3,
.catl-mapbox h3,
.catp-mapbox h3,
.artl-mapbox h3,
.artp-mapbox h3,
.ctc-mapbox h3 {
    margin: 0 0 0.4rem;
    font-size: 1.5rem;
    font-weight: 800;
}

.svcl-mapbox p,
.svcp-mapbox p,
.gal-mapbox p,
.city-mapbox p,
.catl-mapbox p,
.catp-mapbox p,
.artl-mapbox p,
.artp-mapbox p,
.ctc-mapbox p {
    margin: 0 0 1.4rem;
    opacity: 0.9;
}

.svcl-faq,
.svcp-faq,
.gal-faq,
.city-faq,
.catl-faq,
.catp-faq,
.artl-faq,
.artp-faq,
.ctc-faq {
    max-width: 820px;
    margin: 0 auto;
    display: grid;
    gap: 0.8rem;
}

.svcl-fq,
.svcp-fq,
.gal-fq,
.city-fq,
.catl-fq,
.catp-fq,
.artl-fq,
.artp-fq,
.ctc-fq {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    transition:
        box-shadow 0.3s,
        border-color 0.3s;
}

.svcl-fq[open],
.svcp-fq[open],
.gal-fq[open],
.city-fq[open],
.catl-fq[open],
.catp-fq[open],
.artl-fq[open],
.artp-fq[open],
.ctc-fq[open] {
    box-shadow: 0 12px 28px rgba(var(--g9-rgb), 0.1);
    border-color: color-mix(in srgb, var(--g7) 35%, #fff);
}

.svcl-fq summary,
.svcp-fq summary,
.gal-fq summary,
.city-fq summary,
.catl-fq summary,
.catp-fq summary,
.artl-fq summary,
.artp-fq summary,
.ctc-fq summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1.1rem 1.3rem;
    font-weight: 700;
}

.svcl-fq summary::after,
.svcp-fq summary::after,
.gal-fq summary::after,
.city-fq summary::after,
.catl-fq summary::after,
.catp-fq summary::after,
.artl-fq summary::after,
.artp-fq summary::after,
.ctc-fq summary::after {
    content: "+";
    flex: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--chip);
    color: var(--g7);
    display: grid;
    place-items: center;
    font-size: 1.3rem;
    font-weight: 500;
}

.svcl-fq[open] summary::after,
.svcp-fq[open] summary::after,
.gal-fq[open] summary::after,
.city-fq[open] summary::after,
.catl-fq[open] summary::after,
.catp-fq[open] summary::after,
.artl-fq[open] summary::after,
.artp-fq[open] summary::after,
.ctc-fq[open] summary::after {
    content: "\2212";
    background: var(--g7);
    color: #fff;
}

.svcl-fq p,
.svcp-fq p,
.gal-fq p,
.city-fq p,
.catl-fq p,
.catp-fq p,
.artl-fq p,
.artp-fq p,
.ctc-fq p {
    margin: 0;
    padding: 0 1.3rem 1.2rem;
    color: var(--mute);
    line-height: 1.95;
}

.svcp-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: svcp-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.svcp-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: svcp-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.svcp-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: svcp-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.svcp-fab-call {
    background: var(--g7);
    position: relative;
    animation: svcp-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.svcp-fab-call::before,
.svcp-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: svcp-ripple 2.6s ease-out infinite;
}

.svcp-hgrid,
.city-hgrid,
.artp-hgrid {
    grid-template-columns: minmax(0, 1fr);
}

.svcp-hz,
.city-hz,
.artp-hz {
    scroll-margin-top: 100px;
}

.svcp-cat-pill,
.artp-cat-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.4rem 1.1rem;
    margin-bottom: 1rem;
    border-radius: 99px;
    background: var(--lime);
    color: var(--g9);
    font-weight: 800;
    font-size: 0.9rem;
    transition: filter 0.2s;
}

.svcp-cat-pill svg,
.artp-cat-pill svg {
    width: 1rem;
    height: 1rem;
}

.svcp-sv-head h1 {
    margin-bottom: 1rem;
}

.svcp-sv-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-top: 1.6rem;
}

.svcp-sv-areas {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    list-style: none;
    margin: 1.4rem 0 0;
    padding: 0;
}

.svcp-sv-areas li {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.95rem;
    border-radius: 99px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.3);
    font-weight: 700;
    font-size: 0.92rem;
}

.svcp-sv-grid {
    display: grid;
    gap: 2rem;
    align-items: start;
}

.svcp-sv-body h2 {
    margin: 0 0 1.5rem;
    font-size: clamp(1.6rem, 3vw, 2.1rem);
    font-weight: 800;
    color: var(--g9);
}

.svcp-sv-prose {
    font-size: 1.06rem;
    line-height: 2;
    color: var(--ink);
    margin-bottom: 2rem;
}

.svcp-sv-prose p {
    margin: 0 0 1.1rem;
}

.svcp-sv-prose h2,
.svcp-sv-prose h3,
.svcp-sv-sub,
.artp-prose h1,
.artp-prose h2,
.artp-prose h3 {
    scroll-margin-top: 100px;
    line-height: 1.55;
}

.svcp-sv-prose h2 {
    font-size: clamp(1.3rem, 2.6vw, 1.6rem);
    font-weight: 800;
    color: var(--g9);
    margin: 2rem 0 1rem;
    padding: 0.75rem 1.1rem;
    background: color-mix(in srgb, var(--g7) 9%, #fff);
    border-inline-start: 6px solid var(--g7);
    border-radius: 6px 16px 16px 6px;
}

.svcp-sv-prose h3,
.svcp-sv-sub {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--g7);
    margin: 1.8rem 0 0.8rem;
}

.svcp-sv-prose ul,
.svcp-sv-prose ol {
    margin: 0 0 1.3rem;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.55rem;
}

.svcp-sv-prose ul li {
    position: relative;
    padding-inline-start: 1.8rem;
}

.svcp-sv-prose ul li::before {
    content: "";
    position: absolute;
    inset-inline-start: 0.2rem;
    top: 0.85em;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background: var(--g5);
}

.svcp-sv-prose ol,
.artp-prose ol {
    counter-reset: s;
}

.svcp-sv-prose ol li {
    counter-increment: s;
    position: relative;
    padding-inline-start: 2.6rem;
}

.svcp-sv-prose ol li::before {
    content: counter(s);
    position: absolute;
    inset-inline-start: 0;
    top: 0.4em;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 50%;
    background: var(--g7);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 0.85rem;
    font-weight: 800;
    line-height: 1;
}

.svcp-sv-sub,
.artp-prose > *:first-child {
    margin-top: 0;
}

.svcp-sv-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
}

.svcp-sv-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    padding: 1.05rem 1.15rem;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    line-height: 1.75;
}

.svcp-sv-list li::before {
    content: "\2713";
    content: "\2713"/"";
    flex: none;
    width: 1.7rem;
    height: 1.7rem;
    margin-top: 0.1rem;
    border-radius: 50%;
    background: color-mix(in srgb, var(--g7) 14%, #fff);
    color: var(--g7);
    display: grid;
    place-items: center;
    font-weight: 800;
    font-size: 0.9rem;
}

.svcp-sv-info {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 1.6rem;
    box-shadow: 0 10px 30px rgba(var(--g9-rgb), 0.07);
}

.svcp-sv-info h2 {
    margin: 0 0 0.6rem;
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--g9);
}

.svcp-sv-info dl {
    margin: 0 0 1.3rem;
}

.svcp-sv-info dl > div {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.2rem 0.8rem;
    padding: 0.85rem 0;
    border-bottom: 1px solid var(--line);
}

.svcp-sv-info dl > div:last-child {
    border-bottom: 0;
}

.svcp-sv-info dt {
    color: var(--mute);
    font-size: 0.92rem;
}

.svcp-sv-info dd {
    margin: 0;
    font-weight: 700;
    color: var(--ink);
}

.svcp-sv-info dd a:hover {
    text-decoration: underline;
}

.svcp-sv-info .svcp-sv-rate {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.svcp-sv-info .svcp-sv-rate svg {
    width: 1.05rem;
    height: 1.05rem;
    fill: var(--star);
    stroke: none;
}

.svcp-sv-info .svcp-mbtn {
    display: flex;
    justify-content: center;
    width: 100%;
    min-height: 50px;
}

.svcp-sv-gallery,
.svcp-sv-related {
    background: #fff;
}

.svcp-sv-gal button.svcp-g-card {
    border: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    text-align: start;
    cursor: zoom-in;
    width: 100%;
}

.svcp-sv-gal .svcp-g-overlay {
    justify-content: flex-end;
}

.svcp-sv-gal .svcp-g-action {
    display: grid;
}

.svcp-sv-gal .svcp-g-title {
    display: block;
    -webkit-line-clamp: unset;
}

.svcp-faq {
    max-width: 860px;
    margin: 0 auto;
    display: grid;
    gap: 0.8rem;
}

.svcp-fq {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    transition:
        box-shadow 0.25s,
        border-color 0.25s;
}

.svcp-fq[open] {
    border-color: color-mix(in srgb, var(--g7) 40%, #fff);
    box-shadow: 0 10px 26px rgba(var(--g9-rgb), 0.08);
}

.svcp-fq summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 60px;
    padding: 0.9rem 1.3rem;
    font-weight: 800;
    font-size: 1.05rem;
    color: var(--g9);
    cursor: pointer;
    list-style: none;
}

.svcp-fq .svcp-fa {
    padding: 0 1.3rem 1.2rem;
    color: var(--mute);
    line-height: 1.95;
}

.svcp-lb {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: flex;
    flex-direction: column;
    background: rgba(8, 26, 19, 0.97);
    color: #fff;
}

.svcp-lb-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: calc(14px + env(safe-area-inset-top, 0px)) 16px 10px;
}

.svcp-lb-count {
    font-weight: 800;
    letter-spacing: 0.02em;
    direction: ltr;
    unicode-bidi: isolate;
}

.svcp-lb-x {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #fff;
    cursor: pointer;
}

.svcp-lb :focus-visible {
    outline: 3px solid var(--lime);
    outline-offset: 3px;
}

.svcp-lb-view {
    flex: 1;
    min-height: 0;
    overflow: hidden;
    position: relative;
    touch-action: pan-y;
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
}

.svcp-lb-view:active {
    cursor: grabbing;
}

.svcp-lb-track {
    display: flex;
    height: 100%;
    direction: rtl;
    transition: transform 0.38s cubic-bezier(0.2, 0.8, 0.2, 1);
    will-change: transform;
}

.svcp-lb-slide {
    flex: 0 0 100%;
    height: 100%;
    display: grid;
    place-items: center;
    padding: 8px clamp(14px, 8vw, 110px);
}

.svcp-lb-slide img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 16px;
    pointer-events: none;
}

.svcp-lb-slide .svcp-g-bg {
    display: block;
    position: relative;
    inset: auto;
    overflow: hidden;
    width: min(100%, 1000px);
    aspect-ratio: 16/10;
    max-height: 100%;
    border-radius: 18px;
    transition: none;
    transform: none;
}

.svcp-lb-slide .svcp-g-bg > svg {
    width: 36%;
}

.svcp-lb-nav {
    position: absolute;
    top: 50%;
    margin-top: -26px;
    z-index: 3;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #fff;
    cursor: pointer;
    transition:
        background 0.2s,
        opacity 0.2s;
}

.svcp-lb-nav:hover {
    background: rgba(255, 255, 255, 0.26);
}

.svcp-lb-nav[aria-disabled="true"] {
    opacity: 0.3;
    cursor: default;
}

.svcp-lb-next {
    left: 14px;
}

.svcp-lb-prev {
    right: 14px;
}

.svcp-lb-cap {
    margin: 0;
    padding: 12px 16px calc(18px + env(safe-area-inset-bottom, 0px));
    text-align: center;
    font-weight: 700;
    min-height: 3.2rem;
}

.gal-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: gal-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.gal-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: gal-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.gal-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: gal-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.gal-fab-call {
    background: var(--g7);
    position: relative;
    animation: gal-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.gal-fab-call::before,
.gal-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: gal-ripple 2.6s ease-out infinite;
}

.gal-gtype {
    display: flex;
    gap: 0.3rem;
    width: max-content;
    max-width: 100%;
    margin: 0 auto 1.4rem;
    padding: 0.35rem;
    border-radius: 99px;
    background: #fff;
    border: 1px solid var(--line);
}

.gal-gtp,
.catp-gtp {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1.5rem;
    border: 0;
    border-radius: 99px;
    background: transparent;
    color: var(--ink);
    font: inherit;
    font-weight: 800;
    cursor: pointer;
    transition:
        background 0.25s,
        color 0.25s;
}

.gal-gtp.gal-on,
.catp-gtp.catp-on {
    background: var(--g9);
    color: #fff;
}

.gal-gtp small,
.catp-gtp small {
    font-size: 0.78rem;
    font-weight: 700;
    opacity: 0.75;
}

.gal-lb-media .gal-pl {
    width: 88px;
    height: 88px;
    margin: -44px 0 0 -44px;
}

.gal-gtabs {
    display: flex;
    gap: 0.6rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 2.2rem;
}

.gal-gtab,
.catl-atab,
.catp-atab,
.artl-atab {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.1rem;
    border-radius: 99px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--ink);
    font: inherit;
    font-weight: 700;
    font-size: 0.95rem;
    cursor: pointer;
    transition:
        background 0.25s,
        color 0.25s,
        border-color 0.25s;
}

.gal-gtab b,
.catl-atab b,
.catp-atab b,
.artl-atab b {
    display: grid;
    place-items: center;
    min-width: 24px;
    height: 24px;
    padding: 0 0.35rem;
    border-radius: 99px;
    background: var(--chip);
    color: var(--g7);
    font-size: 0.78rem;
}

.gal-gtab:hover,
.catl-atab:hover,
.catp-atab:hover,
.artl-atab:hover {
    border-color: var(--g7);
}

.gal-gtab.gal-on,
.catl-atab.catl-on,
.catp-atab.catp-on,
.artl-atab.artl-on {
    background: var(--g7);
    border-color: var(--g7);
    color: #fff;
}

.gal-gg {
    display: grid;
    gap: 1.2rem;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
}

.gal-category + .gal-category {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid var(--line);
}
.gal-category h3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 0 0 1.25rem;
    color: var(--g9);
    font-size: 1.25rem;
    font-weight: 800;
}
.gal-category h3 span {
    display: inline-grid;
    min-width: 2rem;
    height: 2rem;
    place-items: center;
    padding-inline: 0.5rem;
    border-radius: 999px;
    background: var(--chip);
    color: var(--g7);
    font-size: 0.85rem;
}
#gal-gGrid [id^="gal-image-"],
#gal-gGrid [id^="gal-video-"] {
    scroll-margin-top: 110px;
}

.gal-gi {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 4/3;
    padding: 0;
    border: 0;
    border-radius: 22px;
    overflow: hidden;
    cursor: zoom-in;
    background: var(--g9);
    color: #fff;
    font: inherit;
    text-align: start;
    animation: gal-gin 0.5s both;
    transition:
        transform 0.35s,
        box-shadow 0.35s;
}

.gal-gm {
    position: absolute;
    inset: 0;
    transition: transform 0.6s;
}

.gal-gm > picture,
.gal-th > picture,
.gal-lb-media > picture {
    display: block;
    width: 100%;
    height: 100%;
}
.gal-gm img,
.gal-th img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gal-gi::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(var(--g9-rgb), 0.85),
        rgba(var(--g9-rgb), 0) 55%
    );
}

.gal-gb2 {
    position: absolute;
    z-index: 2;
    top: 12px;
    right: 12px;
    padding: 0.3rem 0.8rem;
    border-radius: 99px;
    background: rgba(2, 56, 3, 0.488);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    font-size: 0.8rem;
    font-weight: 700;
}

.gal-gt2 {
    position: absolute;
    z-index: 2;
    right: 14px;
    left: 14px;
    bottom: 12px;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.5;
}

.gal-gz {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    width: 56px;
    height: 56px;
    margin: -28px 0 0 -28px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    display: grid;
    place-items: center;
    opacity: 0;
    transform: scale(0.7);
    transition:
        opacity 0.3s,
        transform 0.3s;
}

.gal-gz svg {
    width: 22px;
    height: 22px;
}

.gal-pp {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background:
        radial-gradient(
            60% 60% at 25% 30%,
            color-mix(in srgb, var(--x) 70%, #fff),
            transparent
        ),
        linear-gradient(150deg, var(--g9), var(--x));
}

.gal-pp0 {
    --x: var(--g7);
}

.gal-pp1 {
    --x: var(--c2);
}

.gal-pp2 {
    --x: var(--g5);
}

.gal-pp3 {
    --x: var(--c3);
}

.gal-pp4 {
    --x: #2c8a5b;
}

.gal-pp5 {
    --x: #0f6f6a;
}

.gal-pl {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 60px;
    height: 60px;
    margin: -30px 0 0 -30px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(8px);
    display: grid;
    place-items: center;
}

.gal-pl svg {
    position: static;
    width: 24px;
    height: 24px;
    fill: #fff;
    opacity: 1;
}

.gal-lb {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: flex;
    flex-direction: column;
    background: rgba(8, 28, 20, 0.94);
    color: #fff;
    padding: env(safe-area-inset-top, 0px) 0 env(safe-area-inset-bottom, 0px);
    animation: gal-lbin 0.3s;
}

#svcp-lb.gal-lb {
    z-index: 120;
}

.gal-lb-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.2rem;
}

.gal-lb-cnt {
    font-weight: 700;
    letter-spacing: 0.06em;
    direction: ltr;
}

.gal-lb button {
    font: inherit;
    color: #fff;
    cursor: pointer;
}

.gal-lb-x,
.gal-lb-ar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.12);
    display: grid;
    place-items: center;
    flex: none;
    transition:
        background 0.2s,
        color 0.2s;
}

.gal-lb-main {
    flex: 1;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 0 1rem;
}

.gal-lb-fig {
    margin: 0;
    flex: 1;
    max-width: 920px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.9rem;
    min-width: 0;
}

.gal-lb-media {
    position: relative;
    width: 100%;
    height: min(60vh, 560px);
    border-radius: 24px;
    overflow: hidden;
    background: #06201a;
    transition: opacity 0.9s;
}

.gal-lb-media.gal-out {
    opacity: 0;
    transition: opacity 0.22s;
}

.gal-lb-media img,
.gal-lb-media video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.gal-lb-cap {
    text-align: center;
    line-height: 1.6;
}

.gal-lb-cap b {
    display: block;
    font-size: 1.15rem;
}

.gal-lb-cap span {
    color: var(--lime);
    font-size: 0.9rem;
    font-weight: 700;
}

.gal-lb-th {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding: 0.8rem 1.2rem 1rem;
    justify-content: safe center;
    scrollbar-width: none;
}

.gal-th {
    position: relative;
    flex: none;
    width: 72px;
    height: 54px;
    padding: 0;
    border-radius: 12px;
    overflow: hidden;
    border: 2px solid transparent;
    opacity: 0.55;
    transition:
        opacity 0.2s,
        border-color 0.2s;
}

.gal-th.gal-on {
    opacity: 1;
    border-color: var(--lime);
}

.gal-lb :focus-visible {
    outline: 3px solid var(--lime);
    outline-offset: 2px;
}

.city-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: city-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.city-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: city-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.city-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: city-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.city-fab-call {
    background: var(--g7);
    position: relative;
    animation: city-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.city-fab-call::before,
.city-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: city-ripple 2.6s ease-out infinite;
}

.catl-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: catl-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.catl-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: catl-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.catl-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: catl-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.catl-fab-call {
    background: var(--g7);
    position: relative;
    animation: catl-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.catl-fab-call::before,
.catl-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: catl-ripple 2.6s ease-out infinite;
}

.catl-apage,
.catp-apage,
.artl-apage {
    padding: 72px 0 96px;
}

.catl-atool,
.catp-atool,
.artl-atool {
    display: grid;
    gap: 1.2rem;
    margin-bottom: 1.6rem;
}

.catl-sbox,
.catp-sbox,
.artl-sbox {
    position: relative;
    width: min(100%, 600px);
    margin: 0 auto;
}

.catl-sbox > svg,
.catp-sbox > svg,
.artl-sbox > svg {
    position: absolute;
    top: 50%;
    right: 20px;
    width: 22px;
    height: 22px;
    margin-top: -11px;
    color: var(--g7);
    pointer-events: none;
}

.catl-sbox input,
.catp-sbox input,
.artl-sbox input {
    width: 100%;
    height: 58px;
    padding: 0 3.2rem;
    border-radius: 99px;
    border: 1px solid var(--line);
    background: #fff;
    font: inherit;
    font-size: 1rem;
    color: var(--ink);
    transition:
        border-color 0.2s,
        box-shadow 0.2s;
}

.catl-sbox input::placeholder,
.catp-sbox input::placeholder,
.artl-sbox input::placeholder {
    color: var(--mute);
}

.catl-sbox input:focus,
.catp-sbox input:focus,
.artl-sbox input:focus {
    outline: none;
    border-color: var(--g7);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--g7) 15%, transparent);
}

.catl-qclr,
.catp-qclr,
.artl-qclr {
    position: absolute;
    top: 50%;
    left: 12px;
    width: 36px;
    height: 36px;
    margin-top: -18px;
    border: 0;
    border-radius: 50%;
    background: var(--chip);
    color: var(--g7);
    display: grid;
    place-items: center;
    cursor: pointer;
}

.catl-atabs,
.catp-atabs,
.artl-atabs {
    display: flex;
    gap: 0.6rem;
    justify-content: center;
    flex-wrap: wrap;
}

.catl-acnt,
.catp-acnt,
.artl-acnt {
    text-align: center;
    color: var(--mute);
    font-weight: 500;
    min-height: 1.6em;
    margin: 0 0 1.4rem;
}

#aGrid,
#artl-aGrid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 380px));
    justify-content: center;
}

.catl-art:not([hidden]) {
    animation: catl-ain 0.45s both;
}

.catl-aempty,
.catp-aempty,
.artl-aempty {
    text-align: center;
    padding: 3rem 1.5rem;
    border-radius: 26px;
    background: var(--chip);
    border: 1px dashed color-mix(in srgb, var(--g7) 40%, #fff);
}

.catl-aempty > span,
.catp-aempty > span,
.artl-aempty > span {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    margin: 0 auto 1rem;
    border-radius: 50%;
    background: #fff;
    color: var(--g7);
    font-size: 1.7rem;
}

.catl-aempty h3,
.catp-aempty h3,
.artl-aempty h3 {
    margin: 0 0 0.4rem;
    font-size: 1.3rem;
    color: var(--g9);
}

.catl-aempty p,
.catp-aempty p,
.artl-aempty p {
    margin: 0 0 1.2rem;
    color: var(--mute);
}

.catl-aempty button,
.catp-aempty button,
.artl-aempty button {
    border: 0;
    font: inherit;
    cursor: pointer;
}

.catl-cgrid,
.catp-cgrid {
    display: grid;
    gap: 1.75rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 350px), 350px));
    justify-content: center;
}

.catl-cc,
.catp-cc {
    --ac: var(--c1);
    display: block;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    overflow: hidden;
    color: inherit;
    transition:
        transform 0.35s,
        box-shadow 0.35s;
}

.catl-cc .catl-ph,
.catp-cc .catp-ph {
    display: block;
    height: 250px;
}

.catl-cc h3,
.catp-cc h3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    margin: 0;
    padding: 1.2rem 1.4rem;
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--ink);
}

.catl-cc h3 svg,
.catp-cc h3 svg {
    flex: none;
    width: 1.3em;
    height: 1.3em;
    color: var(--ac);
    transition: transform 0.25s;
}

.catp-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: catp-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.catp-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: catp-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.catp-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: catp-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.catp-fab-call {
    background: var(--g7);
    position: relative;
    animation: catp-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.catp-fab-call::before,
.catp-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: catp-ripple 2.6s ease-out infinite;
}

.catp-art:not([hidden]),
.catp-cpanel:not([hidden]) .catp-card {
    animation: catp-ain 0.45s both;
}

.catp-gtype {
    display: flex;
    gap: 0.3rem;
    width: max-content;
    max-width: 100%;
    margin: 0 auto 2.2rem;
    padding: 0.35rem;
    border-radius: 99px;
    background: #fff;
    border: 1px solid var(--line);
}

.catp-gtp:focus-visible {
    outline: 3px solid var(--g7);
    outline-offset: 2px;
}

.artl-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: artl-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.artl-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: artl-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.artl-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: artl-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.artl-fab-call {
    background: var(--g7);
    position: relative;
    animation: artl-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.artl-fab-call::before,
.artl-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: artl-ripple 2.6s ease-out infinite;
}

.artl-art:not([hidden]) {
    animation: artl-ain 0.45s both;
}

.artp-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: artp-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.artp-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: artp-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.artp-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: artp-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.artp-fab-call {
    background: var(--g7);
    position: relative;
    animation: artp-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.artp-fab-call::before,
.artp-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: artp-ripple 2.6s ease-out infinite;
}

.artp-art-head {
    padding: 140px 0 64px;
}

.artp-art-head h1 {
    font-size: clamp(1.9rem, 4.6vw, 3.1rem);
    line-height: 1.4;
    margin: 0 0 0.2rem;
    max-width: 26ch;
}

.artp-art-head .artp-crumb.artp-under {
    margin: 1rem 0 1.7rem;
    flex-wrap: wrap;
}

.artp-art-head .artp-crumb span {
    overflow-wrap: anywhere;
}

.artp-ar-by {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 2rem;
}

.artp-ar-author {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.artp-ar-av {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-items: center;
    flex: none;
}

.artp-ar-av svg {
    width: 26px;
    height: 26px;
}

.artp-ar-author strong {
    display: block;
    font-weight: 800;
}

.artp-ar-author small {
    display: block;
    opacity: 0.85;
    font-size: 0.85rem;
}

.artp-ar-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.3rem;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.92rem;
    opacity: 0.95;
}

.artp-ar-facts li {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.artp-ar-page {
    background: #fff;
    padding: 64px 0 24px;
}

.artp-ar-wrap {
    max-width: 860px;
    margin-inline: auto;
}

.artp-ar-kw {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    list-style: none;
    margin: 0 0 1.7rem;
    padding: 0;
}

.artp-ar-kw li {
    --ac: var(--g7);
    padding: 0.4rem 1rem;
    border-radius: 99px;
    font-weight: 700;
    font-size: 0.9rem;
    background: color-mix(in srgb, var(--ac) 12%, #fff);
    color: var(--ac);
    border: 1px solid color-mix(in srgb, var(--ac) 28%, #fff);
}

.artp-ar-kw li::before {
    content: "#"/"";
    opacity: 0.65;
    margin-inline-end: 0.2rem;
}

.artp-ar-kw li:nth-child(6n + 5) {
    --ac: #8a2f7a;
}

.artp-ar-lead {
    margin: 0 0 2rem;
    padding: 1.4rem 1.6rem;
    border-inline-start: 8px solid var(--g7);
    border-radius: 6px 18px 18px 6px;
    background: color-mix(in srgb, var(--g7) 6%, #fff);
    font-size: 1.15rem;
    line-height: 2;
    font-weight: 500;
    color: var(--g9);
}

.artp-ar-toc {
    margin: 0 0 1.6rem;
    padding: 1.4rem 1.6rem;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
}

.artp-ar-toc-t {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0 0 0.9rem;
    font-weight: 800;
    font-size: 1.15rem;
    color: var(--g9);
}

.artp-ar-toc ol {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: t;
    display: grid;
    gap: 0.15rem;
}

.artp-ar-toc li {
    counter-increment: t;
}

.artp-ar-toc a {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.55rem 0.6rem;
    border-radius: 12px;
    color: var(--ink);
    line-height: 1.6;
    transition:
        background 0.2s,
        color 0.2s;
}

.artp-ar-toc a::before {
    content: counter(t);
    flex: none;
    width: 1.7rem;
    height: 1.7rem;
    margin-top: 0.05rem;
    border-radius: 50%;
    background: color-mix(in srgb, var(--g7) 12%, #fff);
    color: var(--g7);
    display: grid;
    place-items: center;
    font-size: 0.8rem;
    font-weight: 800;
}

.artp-ar-toc a:hover,
.artp-ar-toc a[aria-current="true"] {
    background: color-mix(in srgb, var(--g7) 9%, #fff);
    color: var(--g7);
}

.artp-ar-share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    margin: 0 0 2.6rem;
    padding: 1rem 1.2rem;
    border-radius: 20px;
    background: color-mix(in srgb, var(--g7) 6%, #fff);
    border: 1px solid var(--line);
}

.artp-ar-share-t {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 800;
    color: var(--g9);
    margin-inline-end: 0.4rem;
}

.artp-sb {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 44px;
    padding: 0.5rem 1.1rem;
    border-radius: 99px;
    border: 0;
    font: inherit;
    font-weight: 700;
    font-size: 0.92rem;
    color: #fff;
    cursor: pointer;
    transition:
        transform 0.2s,
        filter 0.2s,
        background 0.2s;
}

.artp-sb:hover {
    transform: translateY(-2px);
    filter: brightness(1.1);
}

.artp-sb-copy {
    background: #fff;
    color: var(--g9);
    border: 1.5px solid var(--g7);
}

.artp-sb-fb {
    background: #1459b8;
}

.artp-prose {
    font-size: 1.08rem;
    line-height: 2.05;
    color: var(--ink);
}

.artp-prose p {
    margin: 0 0 1.2rem;
}

.artp-prose figure.table {
    max-width: 100%;
    margin: 1.75rem 0;
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(var(--g9-rgb), 0.08);
    -webkit-overflow-scrolling: touch;
}

.artp-prose figure.table table {
    width: 100%;
    min-width: 600px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.9em;
    line-height: 1.6;
}

.artp-prose figure.table th,
.artp-prose figure.table td {
    padding: 0.8rem 1rem !important;
    border: 0;
    border-bottom: 1px solid var(--line);
    text-align: start;
    vertical-align: middle;
}

.artp-prose figure.table thead th {
    background: linear-gradient(135deg, var(--g9), var(--g7));
    color: #fff;
    font-weight: 800;
    white-space: nowrap;
}

.artp-prose figure.table tbody td:first-child {
    color: var(--g9);
    font-weight: 700;
}

.artp-prose figure.table tbody tr:nth-child(even) td {
    background: var(--paper);
}

.artp-prose figure.table tbody tr:hover td {
    background: #edf5eb;
}

.artp-prose figure.table tbody tr:last-child td {
    border-bottom: 0;
}

.artp-prose h1 {
    font-size: clamp(1.7rem, 3.4vw, 2.2rem);
    font-weight: 800;
    color: var(--g9);
    margin: 2.8rem 0 1.1rem;
    padding-inline-start: 1rem;
    border-inline-start: 6px solid var(--c3);
}

.artp-prose h2 {
    font-size: clamp(1.35rem, 2.8vw, 1.7rem);
    font-weight: 800;
    color: var(--g9);
    margin: 2.8rem 0 1.1rem;
    padding: 0.8rem 1.1rem;
    background: color-mix(in srgb, var(--g7) 9%, #fff);
    border-inline-start: 6px solid var(--g7);
    border-radius: 6px 16px 16px 6px;
}

.artp-prose h3 {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--g7);
    margin: 1.8rem 0 0.6rem;
}

.artp-prose a {
    color: var(--g7);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.artp-prose ul,
.artp-prose ol {
    margin: 0 0 1.4rem;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.6rem;
}

.artp-prose ul li {
    position: relative;
    padding-inline-start: 1.9rem;
}

.artp-prose ul li::before {
    content: "";
    position: absolute;
    inset-inline-start: 0.2rem;
    top: 0.85em;
    width: 0.62rem;
    height: 0.62rem;
    border-radius: 50%;
    background: var(--g5);
}

.artp-prose ol li {
    counter-increment: s;
    position: relative;
    padding-inline-start: 2.7rem;
}

.artp-prose ol li::before {
    content: counter(s);
    position: absolute;
    inset-inline-start: 0;
    top: 0.4em;
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 50%;
    background: var(--g7);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 0.85rem;
    font-weight: 800;
    line-height: 1;
}

.artp-ar-note {
    margin: 1.6rem 0;
    padding: 1.1rem 1.3rem;
    border-radius: 16px;
    background: color-mix(in srgb, var(--c3) 10%, #fff);
    border-inline-start: 5px solid var(--c3);
    line-height: 1.9;
}

.artp-ar-fig {
    margin: 1.8rem 0;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid var(--line);
    background: #fff;
}

.artp-ar-fig img {
    display: block;
    width: 100%;
    height: auto;
}

.artp-ar-fig-img {
    position: relative;
    aspect-ratio: 16/9;
    background:
        radial-gradient(
            60% 60% at 25% 30%,
            color-mix(in srgb, var(--g5) 70%, #fff),
            transparent
        ),
        linear-gradient(150deg, var(--g9), var(--g7));
}

.artp-ar-fig-img svg {
    position: absolute;
    width: 38%;
    right: -4%;
    bottom: -14%;
    fill: #fff;
    opacity: 0.18;
}

.artp-ar-fig figcaption {
    padding: 0.8rem 1.1rem;
    color: var(--mute);
    font-size: 0.92rem;
}

.artp-ar-cta {
    padding-top: 56px;
}

.artp-cbox .artp-cta-sub {
    margin-bottom: 0.6rem;
    color: var(--lime);
    font-weight: 800;
    opacity: 1;
    font-size: 1.08rem;
}

.artp-ar-backrow {
    text-align: center;
    margin-top: 2rem;
}

.artp-ar-back {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 48px;
    padding: 0.7rem 1.5rem;
    border-radius: 99px;
    border: 1.5px solid var(--g7);
    color: var(--g7);
    font-weight: 800;
    transition:
        background 0.2s,
        color 0.2s;
}

.artp-ar-back svg {
    transform: scaleX(-1);
}

.ctc-leaf {
    position: absolute;
    color: var(--leaf);
    opacity: 0.28;
    animation: ctc-fl var(--d, 7s) ease-in-out infinite alternate;
    animation-delay: var(--dl, 0s);
}

.ctc-badge {
    position: absolute;
    top: 6%;
    left: 6%;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--lime);
    color: var(--g9);
    display: grid;
    place-content: center;
    text-align: center;
    font-weight: 700;
    font-size: 0.9rem;
    box-shadow: 0 12px 30px rgba(var(--g9-rgb), 0.25);
    animation: ctc-fl 6s ease-in-out infinite alternate;
    --r: 0deg;
}

.ctc-train-track {
    display: flex;
    width: max-content;
    padding-block: 0.5rem 1.2rem;
    animation: ctc-moveTrain var(--dur, 40s) linear infinite;
    will-change: transform;
}

.ctc-fab-call {
    background: var(--g7);
    position: relative;
    animation: ctc-ring 2.6s ease-in-out infinite;
    transform-origin: 50% 50%;
}

.ctc-fab-call::before,
.ctc-fab-call::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--g7);
    opacity: 0;
    animation: ctc-ripple 2.6s ease-out infinite;
}

/* ==========================================================================
   2. KEYFRAME ANIMATIONS (49 keyframes preserved)
   ========================================================================== */

@keyframes abyat-kf-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes abyat-kf-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes abyat-kf-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes abyat-kf-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes abt-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes abt-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes abt-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes abt-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes svcl-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes svcl-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes svcl-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes svcl-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes svcp-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes svcp-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes svcp-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes svcp-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes gal-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes gal-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes gal-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes gal-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes gal-gin {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes gal-lbin {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes city-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes city-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes city-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes city-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes catl-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes catl-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes catl-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes catl-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes catl-ain {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes catp-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes catp-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes catp-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes catp-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes catp-ain {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes artl-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes artl-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes artl-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes artl-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes artl-ain {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes artp-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes artp-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes artp-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes artp-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@keyframes ctc-fl {
    from {
        transform: translateY(-14px) rotate(var(--r, 0deg));
    }
    to {
        transform: translateY(14px) rotate(calc(var(--r, 0deg) + 8deg));
    }
}

@keyframes ctc-moveTrain {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(var(--shift, 50%), 0, 0);
    }
}

@keyframes ctc-ring {
    0%,
    55%,
    100% {
        transform: rotate(0);
    }
    6%,
    18%,
    30%,
    42% {
        transform: rotate(-16deg);
    }
    12%,
    24%,
    36%,
    48% {
        transform: rotate(16deg);
    }
}

@keyframes ctc-ripple {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    60%,
    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

/* ==========================================================================
   3. MEDIA QUERIES (MERGED INDEPENDENTLY PER MEDIA QUERY)
   Grouped by media query; identical declaration blocks inside merged into single rules.
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}

@media (prefers-reduced-motion: reduce) {
    .abyat-fab,
    .abyat-fab.abyat-fab-show {
        transition: none;
    }
}

@media (min-width: 992px) {
    .abyat-ab,
    .abt-ab,
    .svcl-ab,
    .svcp-ab,
    .gal-ab,
    .city-ab,
    .catl-ab,
    .catp-ab,
    .artl-ab,
    .artp-ab,
    .ctc-ab {
        grid-template-columns: 1.1fr 0.9fr;
    }

    .abyat-gallery-grid,
    .abt-gallery-grid,
    .svcl-gallery-grid,
    .svcp-gallery-grid,
    .gal-gallery-grid,
    .city-gallery-grid,
    .catl-gallery-grid,
    .catp-gallery-grid,
    .artl-gallery-grid,
    .artp-gallery-grid,
    .ctc-gallery-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1.1rem;
        grid-auto-rows: 210px;
    }

    .abyat-cgrid,
    .abt-cgrid,
    .svcl-cgrid,
    .svcp-cgrid,
    .gal-cgrid,
    .city-cgrid,
    .catl-cgrid,
    .catp-cgrid,
    .artl-cgrid,
    .artp-cgrid,
    .ctc-cgrid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    }

    .abyat-ftgrid,
    .abt-ftgrid,
    .svcl-ftgrid,
    .svcp-ftgrid,
    .gal-ftgrid,
    .city-ftgrid,
    .catl-ftgrid,
    .catp-ftgrid,
    .artl-ftgrid,
    .artp-ftgrid,
    .ctc-ftgrid {
        grid-template-columns: 1.45fr 1fr 1fr 1.25fr;
        gap: 2rem 3rem;
    }

    .abyat-mainnav,
    .abt-mainnav,
    .svcl-mainnav,
    .svcp-mainnav,
    .gal-mainnav,
    .city-mainnav,
    .catl-mainnav,
    .catp-mainnav,
    .artl-mainnav,
    .artp-mainnav,
    .ctc-mainnav {
        display: block;
    }

    .abyat-cta,
    .abt-cta,
    .svcl-cta,
    .svcp-cta,
    .gal-cta,
    .city-cta,
    .catl-cta,
    .catp-cta,
    .artl-cta,
    .artp-cta,
    .ctc-cta {
        display: inline-flex;
    }

    .abyat-burger,
    .abt-burger,
    .svcl-burger,
    .svcp-burger,
    .gal-burger,
    .city-burger,
    .catl-burger,
    .catp-burger,
    .artl-burger,
    .artp-burger,
    .ctc-burger {
        display: none;
    }

    .svcp-sv-grid {
        grid-template-columns: minmax(0, 1fr) 350px;
        gap: 2.5rem;
    }

    .svcp-sv-info {
        position: sticky;
        top: 104px;
    }
}

@media (hover: hover) {
    .abyat-card:hover,
    .abt-card:hover,
    .svcl-card:hover,
    .svcp-card:hover,
    .gal-card:hover,
    .city-card:hover,
    .catl-card:hover,
    .catl-cc:hover,
    .catp-card:hover,
    .catp-cc:hover,
    .artl-card:hover,
    .artp-card:hover,
    .ctc-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 22px 44px rgba(var(--g9-rgb), 0.18);
    }

    .abyat-card:hover .abyat-im,
    .abt-card:hover .abt-im,
    .svcl-card:hover .svcl-im,
    .svcp-card:hover .svcp-im,
    .gal-card:hover .gal-im,
    .gal-gi:hover .gal-gm,
    .city-card:hover .city-im,
    .catl-card:hover .catl-im,
    .catl-cc:hover .catl-im,
    .catp-card:hover .catp-im,
    .catp-cc:hover .catp-im,
    .artl-card:hover .artl-im,
    .artp-card:hover .artp-im,
    .ctc-card:hover .ctc-im {
        transform: scale(1.08);
    }

    .abyat-card:hover .abyat-go,
    .abt-card:hover .abt-go,
    .svcl-card:hover .svcl-go,
    .svcp-card:hover .svcp-go,
    .gal-card:hover .gal-go,
    .gal-gi:hover .gal-gz,
    .city-card:hover .city-go,
    .catl-card:hover .catl-go,
    .catl-cc:hover .catl-go,
    .catp-card:hover .catp-go,
    .catp-cc:hover .catp-go,
    .artl-card:hover .artl-go,
    .artp-card:hover .artp-go,
    .ctc-card:hover .ctc-go {
        opacity: 1;
        transform: none;
    }

    .abyat-g-card:hover,
    .abt-g-card:hover,
    .svcl-g-card:hover,
    .svcp-g-card:hover,
    .gal-g-card:hover,
    .city-g-card:hover,
    .catl-g-card:hover,
    .catp-g-card:hover,
    .artl-g-card:hover,
    .artp-g-card:hover,
    .ctc-g-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 18px 36px rgba(var(--g9-rgb), 0.2);
    }

    .abyat-g-card:hover .abyat-g-bg,
    .abt-g-card:hover .abt-g-bg,
    .svcl-g-card:hover .svcl-g-bg,
    .svcp-g-card:hover .svcp-g-bg,
    .gal-g-card:hover .gal-g-bg,
    .city-g-card:hover .city-g-bg,
    .catl-g-card:hover .catl-g-bg,
    .catp-g-card:hover .catp-g-bg,
    .artl-g-card:hover .artl-g-bg,
    .artp-g-card:hover .artp-g-bg,
    .ctc-g-card:hover .ctc-g-bg {
        transform: scale(1.07);
    }

    .abyat-g-card:hover .abyat-g-action,
    .abt-g-card:hover .abt-g-action,
    .svcl-g-card:hover .svcl-g-action,
    .svcp-g-card:hover .svcp-g-action,
    .gal-g-card:hover .gal-g-action,
    .city-g-card:hover .city-g-action,
    .catl-g-card:hover .catl-g-action,
    .catp-g-card:hover .catp-g-action,
    .artl-g-card:hover .artl-g-action,
    .artp-g-card:hover .artp-g-action,
    .ctc-g-card:hover .ctc-g-action {
        transform: scale(1.1);
        background: #fff;
    }

    .abyat-slider-container:hover .abyat-train-track,
    .abt-slider-container:hover .abt-train-track,
    .svcl-slider-container:hover .svcl-train-track,
    .svcp-slider-container:hover .svcp-train-track,
    .gal-slider-container:hover .gal-train-track,
    .city-slider-container:hover .city-train-track,
    .catl-slider-container:hover .catl-train-track,
    .catp-slider-container:hover .catp-train-track,
    .artl-slider-container:hover .artl-train-track,
    .artp-slider-container:hover .artp-train-track,
    .ctc-slider-container:hover .ctc-train-track {
        animation-play-state: paused;
    }

    a.abyat-qc-item:hover,
    a.abt-qc-item:hover,
    a.svcl-qc-item:hover,
    a.svcp-qc-item:hover,
    a.gal-qc-item:hover,
    a.city-qc-item:hover,
    a.catl-qc-item:hover,
    a.catp-qc-item:hover,
    a.artl-qc-item:hover,
    a.artp-qc-item:hover,
    a.ctc-qc-item:hover {
        transform: translateY(-4px);
        border-color: color-mix(in srgb, var(--ac) 40%, #fff);
        box-shadow: 0 16px 34px rgba(var(--g9-rgb), 0.12);
    }

    .abt-pc:hover,
    .abt-stp:hover,
    .svcl-pc:hover,
    .svcl-stp:hover,
    .svcp-pc:hover,
    .svcp-stp:hover,
    .gal-pc:hover,
    .gal-stp:hover,
    .city-pc:hover,
    .city-stp:hover,
    .catl-pc:hover,
    .catl-stp:hover,
    .catp-pc:hover,
    .catp-stp:hover,
    .artl-pc:hover,
    .artl-stp:hover,
    .artp-pc:hover,
    .artp-stp:hover,
    .ctc-pc:hover,
    .ctc-stp:hover {
        transform: translateY(-6px);
        box-shadow: 0 20px 40px rgba(var(--g9-rgb), 0.14);
    }

    .abt-stp,
    .svcl-stp,
    .svcp-stp,
    .gal-stp,
    .city-stp,
    .catl-stp,
    .catp-stp,
    .artl-stp,
    .artp-stp,
    .ctc-stp {
        transition:
            transform 0.35s,
            box-shadow 0.35s;
    }

    .gal-gi:hover {
        transform: translateY(-6px);
        box-shadow: 0 20px 40px rgba(var(--g9-rgb), 0.2);
    }

    .catl-cc:hover h3 svg,
    .catp-cc:hover h3 svg {
        transform: translateX(-5px);
    }
}

@media (min-width: 800px) {
    .abyat-ng,
    .abt-ng,
    .svcl-ng,
    .svcp-ng,
    .gal-ng,
    .city-ng,
    .catl-ng,
    .catp-ng,
    .artl-ng,
    .artp-ng,
    .ctc-ng {
        grid-template-columns: repeat(4, 1fr);
    }

    .abyat-ni + .abyat-ni,
    .abt-ni + .abt-ni,
    .svcl-ni + .svcl-ni,
    .svcp-ni + .svcp-ni,
    .gal-ni + .gal-ni,
    .city-ni + .city-ni,
    .catl-ni + .catl-ni,
    .catp-ni + .catp-ni,
    .artl-ni + .artl-ni,
    .artp-ni + .artp-ni,
    .ctc-ni + .ctc-ni {
        border-inline-start: 1px solid rgba(255, 255, 255, 0.2);
    }
}

@media (max-width: 640px) {
    .abyat-gallery-grid,
    .abt-gallery-grid,
    .svcl-gallery-grid,
    .svcp-gallery-grid,
    .gal-gallery-grid,
    .city-gallery-grid,
    .catl-gallery-grid,
    .catp-gallery-grid,
    .artl-gallery-grid,
    .artp-gallery-grid,
    .ctc-gallery-grid {
        gap: 1rem;
        grid-auto-rows: 190px;
    }

    .abyat-g-overlay,
    .abt-g-overlay,
    .svcl-g-overlay,
    .svcp-g-overlay,
    .gal-g-overlay,
    .city-g-overlay,
    .catl-g-overlay,
    .catp-g-overlay,
    .artl-g-overlay,
    .artp-g-overlay,
    .ctc-g-overlay {
        padding: 1.15rem;
    }

    .abyat-g-title,
    .abt-g-title,
    .svcl-g-title,
    .svcp-g-title,
    .gal-g-title,
    .city-g-title,
    .catl-g-title,
    .catp-g-title,
    .artl-g-title,
    .artp-g-title,
    .ctc-g-title {
        font-size: 1.02rem;
    }

    .abyat-g-action,
    .abt-g-action,
    .svcl-g-action,
    .svcp-g-action,
    .gal-g-action,
    .city-g-action,
    .catl-g-action,
    .catp-g-action,
    .artl-g-action,
    .artp-g-action,
    .ctc-g-action {
        display: grid;
    }

    .abyat-fgrid,
    .abyat-ftgrid,
    .abt-fgrid,
    .abt-ftgrid,
    .svcl-fgrid,
    .svcl-ftgrid,
    .svcp-fgrid,
    .svcp-ftgrid,
    .gal-fgrid,
    .gal-ftgrid,
    .city-fgrid,
    .city-ftgrid,
    .catl-fgrid,
    .catl-ftgrid,
    .catp-fgrid,
    .catp-ftgrid,
    .artl-fgrid,
    .artl-ftgrid,
    .artp-fgrid,
    .artp-ftgrid,
    .ctc-fgrid,
    .ctc-ftgrid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .abyat-fgrid .abyat-full,
    .abt-fgrid .abt-full,
    .svcl-fgrid .svcl-full,
    .svcp-fgrid .svcp-full,
    .gal-fgrid .gal-full,
    .city-fgrid .city-full,
    .catl-fgrid .catl-full,
    .catp-fgrid .catp-full,
    .artl-fgrid .artl-full,
    .artp-fgrid .artp-full,
    .ctc-fgrid .ctc-full {
        grid-column: 1/-1;
    }

    .abyat-cform .abyat-mbtn,
    .abt-cform .abt-mbtn,
    .svcl-cform .svcl-mbtn,
    .svcp-cform .svcp-mbtn,
    .gal-cform .gal-mbtn,
    .city-cform .city-mbtn,
    .catl-cform .catl-mbtn,
    .catp-cform .catp-mbtn,
    .artl-cform .artl-mbtn,
    .artp-cform .artp-mbtn,
    .ctc-cform .ctc-mbtn {
        width: auto;
        min-width: 220px;
    }
}

@media (min-width: 480px) {
    .abyat-soc4,
    .abt-soc4,
    .svcl-soc4,
    .svcp-soc4,
    .gal-soc4,
    .city-soc4,
    .catl-soc4,
    .catp-soc4,
    .artl-soc4,
    .artp-soc4,
    .ctc-soc4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .abyat-blog-section,
    .abyat-contact-section,
    .abyat-about,
    .abyat-svc,
    .abyat-gallery-section,
    .abyat-reviews-section,
    .abt-blog-section,
    .abt-contact-section,
    .abt-about,
    .abt-svc,
    .abt-gallery-section,
    .abt-reviews-section,
    .svcl-blog-section,
    .svcl-contact-section,
    .svcl-about,
    .svcl-svc,
    .svcl-gallery-section,
    .svcl-reviews-section,
    .svcp-blog-section,
    .svcp-contact-section,
    .svcp-about,
    .svcp-svc,
    .svcp-gallery-section,
    .svcp-reviews-section,
    .gal-blog-section,
    .gal-contact-section,
    .gal-about,
    .gal-svc,
    .gal-gallery-section,
    .gal-reviews-section,
    .city-blog-section,
    .city-contact-section,
    .city-about,
    .city-svc,
    .city-gallery-section,
    .city-reviews-section,
    .catl-blog-section,
    .catl-contact-section,
    .catl-about,
    .catl-svc,
    .catl-gallery-section,
    .catl-reviews-section,
    .catp-blog-section,
    .catp-contact-section,
    .catp-about,
    .catp-svc,
    .catp-gallery-section,
    .catp-reviews-section,
    .artl-blog-section,
    .artl-contact-section,
    .artl-about,
    .artl-svc,
    .artl-gallery-section,
    .artl-reviews-section,
    .artp-blog-section,
    .artp-contact-section,
    .artp-about,
    .artp-svc,
    .artp-gallery-section,
    .artp-reviews-section,
    .ctc-blog-section,
    .ctc-contact-section,
    .ctc-about,
    .ctc-svc,
    .ctc-gallery-section,
    .ctc-reviews-section {
        padding: 64px 0;
    }

    .abyat-cform,
    .abt-cform,
    .svcl-cform,
    .svcp-cform,
    .gal-cform,
    .city-cform,
    .catl-cform,
    .catp-cform,
    .artl-cform,
    .artp-cform,
    .ctc-cform {
        padding: 1.4rem;
    }

    .abyat-ccard,
    .abyat-ask,
    .abt-ccard,
    .abt-ask,
    .svcl-ccard,
    .svcl-ask,
    .svcp-ccard,
    .svcp-ask,
    .svcp-sv-info,
    .gal-ccard,
    .gal-ask,
    .city-ccard,
    .city-ask,
    .catl-ccard,
    .catl-ask,
    .catp-ccard,
    .catp-ask,
    .artl-ccard,
    .artl-ask,
    .artp-ccard,
    .artp-ask,
    .ctc-ccard,
    .ctc-ask {
        padding: 1.3rem;
    }

    .abyat-sh-row,
    .abt-sh-row,
    .svcl-sh-row,
    .svcp-sh-row,
    .gal-sh-row,
    .city-sh-row,
    .catl-sh-row,
    .catp-sh-row,
    .artl-sh-row,
    .artp-sh-row,
    .ctc-sh-row {
        margin-bottom: 2rem;
    }

    .abyat-footer,
    .abt-footer,
    .svcl-footer,
    .svcp-footer,
    .gal-footer,
    .city-footer,
    .catl-footer,
    .catp-footer,
    .artl-footer,
    .artp-footer,
    .ctc-footer {
        padding-top: 56px;
    }

    .abyat-fbottom,
    .abt-fbottom,
    .svcl-fbottom,
    .svcp-fbottom,
    .gal-fbottom,
    .city-fbottom,
    .catl-fbottom,
    .catp-fbottom,
    .artl-fbottom,
    .artp-fbottom,
    .ctc-fbottom {
        flex-direction: column;
        text-align: center;
        justify-content: center;
    }

    .abyat-flegal,
    .abt-flegal,
    .svcl-flegal,
    .svcp-flegal,
    .gal-flegal,
    .city-flegal,
    .catl-flegal,
    .catp-flegal,
    .artl-flegal,
    .artp-flegal,
    .ctc-flegal {
        justify-content: center;
    }

    .abyat-fbrand p,
    .abt-fbrand p,
    .svcl-fbrand p,
    .svcp-fbrand p,
    .gal-fbrand p,
    .city-fbrand p,
    .catl-fbrand p,
    .catp-fbrand p,
    .artl-fbrand p,
    .artp-fbrand p,
    .ctc-fbrand p {
        max-width: none;
    }

    .abyat-cw,
    .abt-cw,
    .svcl-cw,
    .svcp-cw,
    .gal-cw,
    .city-cw,
    .catl-cw,
    .catp-cw,
    .artl-cw,
    .artp-cw,
    .ctc-cw {
        padding: 0;
    }

    .abyat-wrap,
    .abt-wrap,
    .svcl-wrap,
    .svcp-wrap,
    .gal-wrap,
    .city-wrap,
    .catl-wrap,
    .catp-wrap,
    .artl-wrap,
    .artp-wrap,
    .ctc-wrap {
        padding: 112px 0px 100px;
    }

    .abyat-nums,
    .abt-nums,
    .svcl-nums,
    .svcp-nums,
    .gal-nums,
    .city-nums,
    .catl-nums,
    .catp-nums,
    .artl-nums,
    .artp-nums,
    .ctc-nums {
        padding: 56px 0;
    }

    .abyat-ar,
    .abt-ar,
    .svcl-ar,
    .svcp-ar,
    .gal-ar,
    .city-ar,
    .catl-ar,
    .catp-ar,
    .artl-ar,
    .artp-ar,
    .ctc-ar {
        width: 42px;
        height: 42px;
    }

    .abyat-dots,
    .abt-dots,
    .svcl-dots,
    .svcp-dots,
    .gal-dots,
    .city-dots,
    .catl-dots,
    .catp-dots,
    .artl-dots,
    .artp-dots,
    .ctc-dots {
        display: none;
    }

    .abyat-bar,
    .abt-bar,
    .svcl-bar,
    .svcp-bar,
    .gal-bar,
    .city-bar,
    .catl-bar,
    .catp-bar,
    .artl-bar,
    .artp-bar,
    .ctc-bar {
        grid-template-columns: auto 1fr;
        padding: 0 16px;
    }

    .abyat-tab-btn,
    .abt-tab-btn,
    .svcl-tab-btn,
    .svcp-tab-btn,
    .gal-tab-btn,
    .city-tab-btn,
    .catl-tab-btn,
    .catp-tab-btn,
    .artl-tab-btn,
    .artp-tab-btn,
    .ctc-tab-btn {
        padding: 0.6rem 1.1rem;
    }

    .svcp-lb-nav {
        width: 44px;
        height: 44px;
        margin-top: -22px;
    }

    .svcp-lb-next {
        left: 6px;
    }

    .svcp-lb-prev {
        right: 6px;
    }

    .svcp-lb-slide {
        padding: 8px 12px;
    }

    .artp-art-head {
        padding: 120px 0 48px;
    }

    .artp-ar-page {
        padding: 44px 0 8px;
    }

    .artp-ar-lead {
        padding: 1.1rem 1.2rem;
        font-size: 1.05rem;
    }

    .artp-ar-toc,
    .artp-ar-share {
        padding: 1.1rem;
    }

    .artp-prose {
        font-size: 1.03rem;
    }

    .artp-prose h2 {
        padding: 0.7rem 0.9rem;
    }

    .artp-ar-cta {
        padding-top: 40px;
    }
}

@media (max-width: 420px) {
    .abyat-cst,
    .abt-cst,
    .svcl-cst,
    .svcp-cst,
    .gal-cst,
    .city-cst,
    .catl-cst,
    .catp-cst,
    .artl-cst,
    .artp-cst,
    .ctc-cst {
        gap: 0.55rem;
        padding: 0.4rem 0.7rem;
    }

    .abyat-sh-row .abyat-mbtn,
    .abt-sh-row .abt-mbtn,
    .svcl-sh-row .svcl-mbtn,
    .svcp-sh-row .svcp-mbtn,
    .gal-sh-row .gal-mbtn,
    .city-sh-row .city-mbtn,
    .catl-sh-row .catl-mbtn,
    .catp-sh-row .catp-mbtn,
    .artl-sh-row .artl-mbtn,
    .artp-sh-row .artp-mbtn,
    .ctc-sh-row .ctc-mbtn {
        width: 100%;
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition: none !important;
        animation: none !important;
    }

    html {
        scroll-behavior: auto;
    }

    .abyat-fab-call,
    .abyat-fab-call::before,
    .abyat-fab-call::after,
    .abt-fab-call,
    .abt-fab-call::before,
    .abt-fab-call::after,
    .svcl-fab-call,
    .svcl-fab-call::before,
    .svcl-fab-call::after,
    .svcp-fab-call,
    .svcp-fab-call::before,
    .svcp-fab-call::after,
    .gal-fab-call,
    .gal-fab-call::before,
    .gal-fab-call::after,
    .gal-gi,
    .gal-lb,
    .city-fab-call,
    .city-fab-call::before,
    .city-fab-call::after,
    .catl-fab-call,
    .catl-fab-call::before,
    .catl-fab-call::after,
    .catl-art:not([hidden]),
    .catp-fab-call,
    .catp-fab-call::before,
    .catp-fab-call::after,
    .catp-art:not([hidden]),
    .catp-cpanel:not([hidden]) .catp-card,
    .artl-fab-call,
    .artl-fab-call::before,
    .artl-fab-call::after,
    .artl-art:not([hidden]),
    .artp-fab-call,
    .artp-fab-call::before,
    .artp-fab-call::after,
    .ctc-fab-call,
    .ctc-fab-call::before,
    .ctc-fab-call::after {
        animation: none;
    }
}

@media (min-width: 768px) {
    .svcp-hz,
    .city-hz,
    .artp-hz {
        flex-direction: row;
    }

    .svcp-hz .svcp-ph,
    .city-hz .city-ph,
    .artp-hz .artp-ph {
        flex: 0 0 42%;
        height: auto;
        min-height: 360px;
    }

    .svcp-hz .svcp-cb,
    .city-hz .city-cb,
    .artp-hz .artp-cb {
        justify-content: center;
        padding: 2.2rem 2.5rem;
    }

    .svcp-hz .svcp-cb h3,
    .city-hz .city-cb h3,
    .artp-hz .artp-cb h3 {
        font-size: 1.75rem;
    }

    .svcp-hz .svcp-cb p,
    .city-hz .city-cb p,
    .artp-hz .artp-cb p {
        font-size: 1.02rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .svcp-hz .svcp-ph,
    .city-hz .city-ph,
    .artp-hz .artp-ph {
        flex-basis: 38%;
    }
}

@media (max-width: 700px) {
    .gal-gtabs,
    .catl-atabs,
    .catp-atabs,
    .artl-atabs {
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 0.4rem;
        scrollbar-width: none;
    }

    .gal-gtab,
    .catl-atab,
    .catp-atab,
    .artl-atab {
        flex: none;
    }

    .gal-lb-ar {
        position: absolute;
        bottom: 92px;
        z-index: 2;
    }

    .gal-lb-nx {
        left: 14px;
    }

    .gal-lb-pv {
        right: 14px;
    }

    .gal-lb-media {
        height: min(52vh, 420px);
    }

    .gal-lb-main {
        padding: 0 0.8rem;
    }
}

@media (min-width: 720px) {
    .artp-ar-toc ol {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 1rem;
    }
}
/* ADDING IMAGES */
.abyat-bg img,
.abyat-im img,
.abyat-g-bg img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: inherit;
}
/* Placeholders must be positioned so the image can fill them */
.abyat-bg,
.abyat-im,
.abyat-g-bg,
.abyat-ph,
.abyat-g-card,
.abyat-abv {
    position: relative;
    overflow: hidden;
}
/* Hero backgrounds are full-bleed layers: keep them absolute */
.abyat-bg {
    position: absolute;
    inset: 0;
}
.abyat-im {
    position: absolute;
    inset: 0;
}

/* Hero: darken image slightly so white text stays readable */
.abyat-bg > img + .abyat-bg-shade,
.abyat-bg:has(> img)::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.25),
        rgba(0, 0, 0, 0.55)
    );
    pointer-events: none;
}

.abyat-abv > .abyat-badge {
    position: absolute;
    z-index: 2;
}

/* Cards: keep labels/buttons above the photo */
.abyat-ph > .abyat-cat,
.abyat-ph > .abyat-city,
.abyat-ph > .abyat-acat,
.abyat-ph > .abyat-go,
.abyat-ph > .abyat-cst {
    z-index: 2;
}
.abyat-cat {
    background: var(--ac);
    border: none;
}
/* Gallery: keep play button + text overlay above the photo */
.abyat-g-play,
.abyat-g-overlay {
    z-index: 2;
}
.abyat-g-bg {
    position: absolute;
    inset: 0;
}

/* Optional: smooth zoom on hover */
.abyat-g-card:hover .abyat-g-bg img,
.abyat-card:hover .abyat-im img {
    transform: scale(1.05);
}
.abyat-g-bg img,
.abyat-im img {
    transition: transform 0.5s ease;
}

.artp-im > img,
.artp-ar-fig-img > img,
.artp-ar-av > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: inherit;
}

.artp-im,
.artp-ar-fig-img,
.artp-ar-av,
.artp-ph {
    position: relative;
    overflow: hidden;
}
.artp-im {
    position: absolute;
    inset: 0;
}

/* Related-article cards: keep the category label above the photo */
.artp-ph > .artp-acat {
    z-index: 2;
}
.artp-im > img {
    transition: transform 0.5s ease;
}
.artp-card:hover .artp-im > img {
    transform: scale(1.05);
}

/* Article figure: keep a 16:9 box if your CSS doesn't already set one */
.artp-ar-fig-img {
    aspect-ratio: 16 / 9;
}

/* Author avatar: round photo */
.artp-ar-av {
    border-radius: 50%;
}

/* Images pasted inside the CKEditor body (.artp-prose) */
.artp-prose img {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    display: block;
    margin-block: 1.25rem;
}
.artp-prose figure {
    margin-inline: 0;
}
.artp-prose figure img {
    margin-block: 0;
}
.artp-prose figcaption {
    font-size: 0.9em;
    opacity: 0.75;
    margin-top: 0.5rem;
}
.artl-im > img,
.artl-im > picture > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: inherit;
    transition: transform 0.5s ease;
}
.artl-ph {
    position: relative;
    overflow: hidden;
}
.artl-im {
    position: absolute;
    inset: 0;
    overflow: hidden;
}
.artl-ph > .artl-acat {
    z-index: 2;
}
.artl-card:hover .artl-im > img,
.artl-card:hover .artl-im > picture > img {
    transform: scale(1.05);
}
.abyat-logo .abyat-mark {
    background: transparent;
    width: 40px;
    height: 40px;
}
.site-logo {
    width: 40px;
    height: 40px;
}
.services-sec {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 120px), 2fr));
}
.new-abyat-item {
    padding: 5px;
    border-radius: 8px;
    background-color: #eaeaeac7;
    font-size: 14px;
    font-weight: bolder;
}
.new-abyat-item .abyat-ic {
    margin-left: 5px;
    display: inline-block;
    vertical-align: text-bottom;
}
/* ===== Image support for the blog list page (artl) =====
   Add AFTER your existing stylesheet. The leaf icon stays underneath as a fallback. */

.artl-im > img,
.artl-im > picture > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: inherit;
    transition: transform 0.5s ease;
}
.artl-ph {
    position: relative;
    overflow: hidden;
}
.artl-im {
    position: absolute;
    inset: 0;
    overflow: hidden;
}
.artl-ph > .artl-acat {
    z-index: 2;
}
.artl-card:hover .artl-im > img,
.artl-card:hover .artl-im > picture > img {
    transform: scale(1.05);
}

.artl-phead {
    position: relative;
    overflow: hidden;
}
.artl-phead-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.artl-phead-bg > picture {
    display: block;
    width: 100%;
    height: 100%;
}
.artl-phead-bg > img,
.artl-phead-bg > picture > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
/* Dark overlay so the title stays readable on any photo */
.artl-phead--img .artl-phead-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.65)
    );
}
.artl-phead--img .artl-leaf {
    z-index: 1;
}
.artl-phead--img .artl-cw {
    position: relative;
    z-index: 2;
}
.artl-phead--img h1,
.artl-phead--img p,
.artl-phead--img .artl-crumb,
.artl-phead--img .artl-crumb a {
    color: #fff;
}
.artl-phead--img .artl-g {
    color: var(--lime, #b7e36b);
}
/* --- Category cards --- */
.catl-im > picture {
    position: absolute;
    inset: 0;
    display: block;
}
.catl-im > img,
.catl-im > picture > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: inherit;
    transition: transform 0.5s ease;
}
.catl-ph {
    position: relative;
    overflow: hidden;
}
.catl-im {
    position: absolute;
    inset: 0;
    overflow: hidden;
}
.catl-go {
    z-index: 2;
}
.catl-cc:hover .catl-im > img,
.catl-cc:hover .catl-im > picture > img {
    transform: scale(1.05);
}

/* --- Page header image --- */
.catl-phead {
    position: relative;
    overflow: hidden;
}
.catl-phead-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.catl-phead-bg > picture {
    display: block;
    width: 100%;
    height: 100%;
}
.catl-phead-bg > img,
.catl-phead-bg > picture > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
/* Dark overlay keeps the title readable on any photo */
.catl-phead--img .catl-phead-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.65)
    );
}
.catl-phead--img .catl-leaf {
    z-index: 1;
}
.catl-phead--img .catl-cw {
    position: relative;
    z-index: 2;
}
.catl-phead--img h1,
.catl-phead--img p,
.catl-phead--img .catl-crumb,
.catl-phead--img .catl-crumb a {
    color: #fff;
}
.catl-phead--img .catl-g {
    color: var(--lime, #b7e36b);
}
/* To go back to the plain header: remove "catl-phead--img" and the .catl-phead-bg div. */
/* ===== Image support for the article page (artp) =====
   Add AFTER your existing stylesheet. The leaf icon stays underneath as a fallback. */

.artp-im > img,
.artp-ar-fig-img > img,
.artp-ar-av > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: inherit;
}

.artp-im,
.artp-ar-fig-img,
.artp-ar-av,
.artp-ph {
    position: relative;
    overflow: hidden;
}
.artp-im {
    position: absolute;
    inset: 0;
}

/* Related-article cards: keep the category label above the photo */
.artp-ph > .artp-acat {
    z-index: 2;
}
.artp-im > img {
    transition: transform 0.5s ease;
}
.artp-card:hover .artp-im > img {
    transform: scale(1.05);
}

/* Article figure: keep a 16:9 box if your CSS doesn't already set one */
.artp-ar-fig-img {
    aspect-ratio: 16 / 9;
}

/* Author avatar: round photo */
.artp-ar-av {
    border-radius: 50%;
}

/* Images pasted inside the CKEditor body (.artp-prose) */
.artp-prose img {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    display: block;
    margin-block: 1.25rem;
}
.artp-prose figure {
    margin-inline: 0;
}
.artp-prose figure img {
    margin-block: 0;
}
.artp-prose figcaption {
    font-size: 0.9em;
    opacity: 0.75;
    margin-top: 0.5rem;
}

/* ===== Article header image (.artp-phead) =====
   The <img> sits in .artp-phead-bg behind the leaves and text.
   To go back to the plain header: remove "artp-phead--img" and the .artp-phead-bg div. */
.artp-phead {
    position: relative;
    overflow: hidden;
}
.artp-phead-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.artp-phead-bg > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.artp-phead-bg > picture,
.artp-im > picture,
.artp-ar-fig-img > picture,
.artp-ar-av > picture {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}
.artp-phead-bg > picture > img,
.artp-im > picture > img,
.artp-ar-fig-img > picture > img,
.artp-ar-av > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: inherit;
}
.artp-im > picture > img {
    transition: transform 0.5s ease;
}
.artp-card:hover .artp-im > picture > img {
    transform: scale(1.05);
}
/* Dark overlay keeps the title readable on any photo */
.artp-phead--img .artp-phead-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.7)
    );
}
.artp-phead--img .artp-leaf {
    z-index: 1;
}
.artp-phead--img .artp-cw {
    position: relative;
    z-index: 2;
}
.artp-phead--img h1,
.artp-phead--img .artp-crumb,
.artp-phead--img .artp-crumb a,
.artp-phead--img .artp-ar-author strong,
.artp-phead--img .artp-ar-author small,
.artp-phead--img .artp-ar-facts,
.artp-phead--img .artp-ar-facts li {
    color: #fff;
}
/* ===== Image support for the single-category page (catp) =====
   Add AFTER your existing stylesheet. The leaf icon stays underneath as a fallback. */

/* --- Service and article cards --- */
.catp-im > img,
.catp-im > picture > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: inherit;
    transition: transform 0.5s ease;
}
.catp-im > picture {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}
.catp-ph {
    position: relative;
    overflow: hidden;
}
.catp-im {
    position: absolute;
    inset: 0;
    overflow: hidden;
}
.catp-ph > .catp-cat,
.catp-ph > .catp-acat,
.catp-ph > .catp-go {
    z-index: 2;
}
.catp-card:hover .catp-im > img,
.catp-card:hover .catp-im > picture > img {
    transform: scale(1.05);
}

/* --- Page header image --- */
.catp-phead {
    position: relative;
    overflow: hidden;
}
.catp-phead-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.catp-phead-bg > img,
.catp-phead-bg > picture > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.catp-phead-bg > picture {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}
/* Dark overlay keeps the title readable on any photo */
.catp-phead--img .catp-phead-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.65)
    );
}
.catp-phead--img .catp-leaf {
    z-index: 1;
}
.catp-phead--img .catp-cw {
    position: relative;
    z-index: 2;
}
.catp-phead--img h1,
.catp-phead--img p,
.catp-phead--img .catp-crumb,
.catp-phead--img .catp-crumb a {
    color: #fff;
}
.catp-phead--img .catp-g {
    color: var(--lime, #b7e36b);
}
/* To go back to the plain header: remove "catp-phead--img" and the .catp-phead-bg div. */
/* ===== Image support for the single-service page (svcp) =====
   Add AFTER your existing stylesheet. The leaf icon stays underneath as a fallback. */

/* --- Gallery tiles (click-to-zoom) and related-service cards --- */
.svcp-g-bg > img,
.svcp-im > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: inherit;
    transition: transform 0.5s ease;
}
.svcp-g-bg {
    position: absolute;
    inset: 0;
    display: block;
    overflow: hidden;
}
.svcp-g-card {
    position: relative;
    overflow: hidden;
}
.svcp-g-overlay {
    z-index: 2;
}
.svcp-g-card:hover .svcp-g-bg > img {
    transform: scale(1.05);
}

.svcp-ph {
    position: relative;
    overflow: hidden;
}
.svcp-im {
    position: absolute;
    inset: 0;
    overflow: hidden;
}
.svcp-ph > .svcp-cat,
.svcp-ph > .svcp-go {
    z-index: 2;
}
.svcp-card:hover .svcp-im > img {
    transform: scale(1.05);
}

/* --- Page header image --- */
.svcp-phead {
    position: relative;
    overflow: hidden;
}
.svcp-phead-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.svcp-phead-bg > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.svcp-phead-bg > picture,
.svcp-g-bg > picture,
.svcp-im > picture {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
}
.svcp-phead-bg > picture > img,
.svcp-g-bg > picture > img,
.svcp-im > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: inherit;
}
.svcp-g-bg > picture > img,
.svcp-im > picture > img {
    transition: transform 0.5s ease;
}
.svcp-g-card:hover .svcp-g-bg > picture > img {
    transform: scale(1.05);
}
.svcp-card:hover .svcp-im > picture > img {
    transform: scale(1.05);
}
/* Dark overlay keeps the title readable on any photo */
.svcp-phead--img .svcp-phead-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.7)
    );
}
.svcp-phead--img .svcp-leaf {
    z-index: 1;
}
.svcp-phead--img .svcp-cw {
    position: relative;
    z-index: 2;
}
.svcp-phead--img h1,
.svcp-phead--img p,
.svcp-phead--img .svcp-crumb,
.svcp-phead--img .svcp-crumb a,
.svcp-phead--img .svcp-sv-areas,
.svcp-phead--img .svcp-sv-areas li {
    color: #fff;
}
/* To go back to the plain header: remove "svcp-phead--img" and the .svcp-phead-bg div. */

/* --- Images pasted into the CKEditor body (.svcp-sv-prose) --- */
.svcp-sv-prose img {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    display: block;
    margin-block: 1.25rem;
}
/* ===== Image support for the services list page (svcl) =====
   Add AFTER your existing stylesheet. The leaf icon stays underneath as a fallback. */

/* --- Service cards --- */
.svcl-im > picture {
    position: absolute;
    inset: 0;
    display: block;
}
.svcl-im > img,
.svcl-im > picture > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: inherit;
    transition: transform 0.5s ease;
}
.svcl-ph {
    position: relative;
    overflow: hidden;
}
.svcl-im {
    position: absolute;
    inset: 0;
    overflow: hidden;
}
.svcl-ph > .svcl-cat,
.svcl-ph > .svcl-go {
    z-index: 2;
}
.svcl-card:hover .svcl-im > img,
.svcl-card:hover .svcl-im > picture > img {
    transform: scale(1.05);
}

/* --- Page header image --- */
.svcl-phead {
    position: relative;
    overflow: hidden;
}
.svcl-phead-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.svcl-phead-bg > picture {
    display: block;
    width: 100%;
    height: 100%;
}
.svcl-phead-bg > img,
.svcl-phead-bg > picture > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
/* Dark overlay keeps the title readable on any photo */
.svcl-phead--img .svcl-phead-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.65)
    );
}
.svcl-phead--img .svcl-leaf {
    z-index: 1;
}
.svcl-phead--img .svcl-cw {
    position: relative;
    z-index: 2;
}
.svcl-phead--img h1,
.svcl-phead--img p,
.svcl-phead--img .svcl-crumb,
.svcl-phead--img .svcl-crumb a {
    color: #fff;
}
.svcl-phead--img .svcl-g {
    color: var(--lime, #b7e36b);
}
/* To go back to the plain header: remove "svcl-phead--img" and the .svcl-phead-bg div. */
/* ===== Image support for the About page (abt) =====
   Add AFTER your existing stylesheet. */

/* --- Story photos (.abt-p1 / .abt-p2): the image replaces the gradient box + leaf icon --- */
.abyat-p1,
.abyat-p2,
.abt-p1,
.abt-p2 {
    overflow: hidden;
}
.abyat-p1 > picture,
.abt-p1 > picture {
    display: block;
    width: 100%;
    height: 100%;
}
.abyat-p1 > img,
.abyat-p1 > picture > img,
.abyat-p2 > img,
.abt-p1 > img,
.abt-p1 > picture > img,
.abt-p2 > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: inherit;
}
.abyat-p1 > img,
.abyat-p1 > picture > img,
.abt-p1 > img,
.abt-p1 > picture > img {
    object-position: right;
}
.abt-abv > .abt-badge {
    z-index: 2;
    width: 72px;
    height: 72px;
    font-size: 0.62rem;
}
.abt-abv > .abt-badge b {
    font-size: 1rem;
}

@media (max-width: 600px) {
    .abyat-abv > .abyat-badge,
    .abt-abv > .abt-badge {
        width: 68px;
        height: 68px;
        font-size: 0.62rem;
    }

    .abyat-abv > .abyat-badge b,
    .abt-abv > .abt-badge b {
        font-size: 1rem;
    }
}

/* --- Page header image --- */
.abt-phead {
    position: relative;
    overflow: hidden;
}
.abt-phead-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.abt-phead-bg > picture {
    display: block;
    width: 100%;
    height: 100%;
}
.abt-phead-bg > img,
.abt-phead-bg > picture > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
/* Dark overlay keeps the title readable on any photo */
.abt-phead--img .abt-phead-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.65)
    );
}
.abt-phead--img .abt-leaf {
    z-index: 1;
}
.abt-phead--img .abt-cw {
    position: relative;
    z-index: 2;
}
.abt-phead--img h1,
.abt-phead--img p,
.abt-phead--img .abt-crumb,
.abt-phead--img .abt-crumb a {
    color: #fff;
}
.abt-phead--img .abt-g {
    color: var(--lime, #b7e36b);
}
/* To go back to the plain header: remove "abt-phead--img" and the .abt-phead-bg div. */
/* ===== Image support for the Contact page (ctc) =====
   Add AFTER your existing stylesheet. */

/* --- Company logo (replaces the leaf icon in .ctc-co-logo) --- */
.ctc-co-logo {
    overflow: hidden;
}
.ctc-co-logo > picture,
.ctc-co-logo > img {
    display: block;
    width: 100%;
    height: 100%;
}
.ctc-co-logo picture img,
.ctc-co-logo > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: inherit;
}

/* --- Page header image --- */
.ctc-phead {
    position: relative;
    overflow: hidden;
}
.ctc-phead-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.ctc-phead-bg > picture,
.ctc-phead-bg > img {
    width: 100%;
    height: 100%;
    display: block;
}
.ctc-phead-bg picture img,
.ctc-phead-bg > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
/* Dark overlay keeps the title readable on any photo */
.ctc-phead--img .ctc-phead-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.65)
    );
}
.ctc-phead--img .ctc-leaf {
    z-index: 1;
}
.ctc-phead--img .ctc-cw {
    position: relative;
    z-index: 2;
}
.ctc-phead--img h1,
.ctc-phead--img p,
.ctc-phead--img .ctc-crumb,
.ctc-phead--img .ctc-crumb a {
    color: #fff;
}
.ctc-phead--img .ctc-g {
    color: var(--lime, #b7e36b);
}
/* To go back to the plain header: remove "ctc-phead--img" and the .ctc-phead-bg div. */

/* --- Location box background (map picture) --- */
.ctc-mapbox {
    position: relative;
    overflow: hidden;
}
.ctc-mapbox-picture {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.ctc-mapbox-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.ctc-mapbox-picture ~ svg,
.ctc-mapbox-picture ~ div,
.ctc-mapbox-bg + svg,
.ctc-mapbox-bg ~ div {
    position: relative;
    z-index: 1;
}
.ctc-mapbox-bg ~ svg {
    z-index: 1;
}
/* Softens the picture so the text and button stay readable */
.ctc-mapbox::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 0;
}
.ctc-mapbox h3,
.ctc-mapbox p {
    color: #fff;
}
.ctc-cform {
    position: relative;
}
.ctc-field-error {
    display: block;
    margin-top: 0.4rem;
    color: #b42318;
    font-size: 0.875rem;
}
.ctc-cform [aria-invalid="true"] {
    border-color: #b42318;
}
.ctc-form-feedback {
    margin: 0.75rem 0;
    padding: 0.8rem 1rem;
    border: 1px solid #f3b4b4;
    border-radius: 12px;
    background: #fff5f5;
    color: #9b1c1c;
}
.ctc-form-success {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 0.75rem;
    padding: 2rem;
    border-radius: inherit;
    background: rgba(255, 255, 255, 0.97);
    text-align: center;
    opacity: 1;
    transition: opacity 0.5s ease;
}
.ctc-form-success.is-fading {
    opacity: 0;
    pointer-events: none;
}
.ctc-form-success[hidden],
.ctc-form-feedback[hidden],
.ctc-field-error[hidden] {
    display: none;
}
.ctc-form-success h3,
.ctc-form-success p {
    margin: 0;
}
.ctc-form-success .ctc-success-mark {
    display: grid;
    width: 76px;
    height: 76px;
    place-items: center;
    border-radius: 50%;
    background: #e8f7d5;
    color: #267238;
}
.ctc-success-mark svg {
    width: 42px;
    height: 42px;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.5;
}
.ctc-cform button:disabled {
    cursor: wait;
    opacity: 0.7;
}
.ctc-service-select {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
.ctc-service-select legend {
    margin-bottom: 0.45rem;
    color: var(--g9);
    font-size: 0.95rem;
    font-weight: 700;
}
.ctc-service-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}
.ctc-fld .ctc-service-option {
    position: relative;
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 0.7rem;
    margin: 0;
    padding: 0.75rem 0.85rem;
    border: 1px solid #d5dfd8;
    border-radius: 14px;
    background: #fbfdfb;
    color: var(--ink);
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition:
        border-color 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}
.ctc-fld .ctc-service-option:hover {
    border-color: var(--g5);
    background: #f5faef;
}
.ctc-service-option input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}
.ctc-service-check {
    display: grid;
    width: 21px;
    height: 21px;
    flex: none;
    place-items: center;
    border: 1.5px solid #aebdb2;
    border-radius: 6px;
    background: #fff;
    color: #fff;
    transition:
        background 0.2s ease,
        border-color 0.2s ease;
}
.ctc-service-check::after {
    width: 6px;
    height: 10px;
    border: solid currentColor;
    border-width: 0 2px 2px 0;
    content: "";
    opacity: 0;
    transform: translateY(-1px) rotate(45deg);
}
.ctc-service-option input:checked + .ctc-service-check {
    border-color: var(--g7);
    background: var(--g7);
}
.ctc-service-option input:checked + .ctc-service-check::after {
    opacity: 1;
}
.ctc-service-option input:focus-visible + .ctc-service-check {
    outline: 3px solid color-mix(in srgb, var(--g7) 28%, transparent);
    outline-offset: 2px;
}
.ctc-service-option:has(input:checked) {
    border-color: var(--g5);
    background: #f4f9ee;
    box-shadow: inset 0 0 0 1px var(--g5);
}
.ctc-service-title {
    line-height: 1.5;
}
.ctc-service-empty {
    grid-column: 1 / -1;
    margin: 0;
    padding: 0.85rem;
    border: 1px dashed #c9d4cc;
    border-radius: 12px;
    color: var(--mute);
}
.ctc-service-select[aria-invalid="true"] .ctc-service-option {
    border-color: #e5a5a0;
}
@media (max-width: 520px) {
    .ctc-service-options {
        grid-template-columns: 1fr;
    }
}
@media (prefers-reduced-motion: reduce) {
    .ctc-form-success {
        transition-duration: 0.01ms;
    }
}
/* ===== Image support for the Gallery page (gal) =====
   Add AFTER your existing stylesheet. */

/* --- Page header image --- */
.gal-phead {
    position: relative;
    overflow: hidden;
}
.gal-phead-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.gal-phead-bg > picture {
    display: block;
    width: 100%;
    height: 100%;
}
.gal-phead-bg > img,
.gal-phead-bg > picture > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
/* Dark overlay keeps the title readable on any photo */
.gal-phead--img .gal-phead-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.45),
        rgba(0, 0, 0, 0.65)
    );
}
.gal-phead--img .gal-leaf {
    z-index: 1;
}
.gal-phead--img .gal-cw {
    position: relative;
    z-index: 2;
}
.gal-phead--img h1,
.gal-phead--img p,
.gal-phead--img .gal-crumb,
.gal-phead--img .gal-crumb a {
    color: #fff;
}
.gal-phead--img .gal-g {
    color: var(--lime, #b7e36b);
}
/* To go back to the plain header: remove "gal-phead--img" and the .gal-phead-bg div. */

@media (min-width: 992px) {
    .catp-cgrid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        justify-content: stretch;
    }
}

@media (max-width: 767px) {
    .abyat-card .abyat-cb,
    .abt-card .abt-cb,
    .svcl-card .svcl-cb,
    .svcp-card .svcp-cb,
    .gal-card .gal-cb,
    .city-card .city-cb,
    .catl-card .catl-cb,
    .catp-card .catp-cb,
    .artl-card .artl-cb,
    .artp-card .artp-cb,
    .ctc-card .ctc-cb {
        padding: 1.15rem;
    }

    .abyat-card .abyat-cb h3,
    .abt-card .abt-cb h3,
    .svcl-card .svcl-cb h3,
    .svcp-card .svcp-cb h3,
    .gal-card .gal-cb h3,
    .city-card .city-cb h3,
    .catl-card .catl-cb h3,
    .catp-card .catp-cb h3,
    .artl-card .artl-cb h3,
    .artp-card .artp-cb h3,
    .ctc-card .ctc-cb h3 {
        font-size: 1.12rem;
        line-height: 1.5;
    }

    .abyat-card .abyat-cb p,
    .abt-card .abt-cb p,
    .svcl-card .svcl-cb p,
    .svcp-card .svcp-cb p,
    .gal-card .gal-cb p,
    .city-card .city-cb p,
    .catl-card .catl-cb p,
    .catp-card .catp-cb p,
    .artl-card .artl-cb p,
    .artp-card .artp-cb p,
    .ctc-card .ctc-cb p {
        font-size: 0.88rem;
        line-height: 1.75;
    }

    .abyat-card .abyat-cb li,
    .abt-card .abt-cb li,
    .svcl-card .svcl-cb li,
    .svcp-card .svcp-cb li,
    .gal-card .gal-cb li,
    .city-card .city-cb li,
    .catl-card .catl-cb li,
    .catp-card .catp-cb li,
    .artl-card .artl-cb li,
    .artp-card .artp-cb li,
    .ctc-card .ctc-cb li {
        font-size: 0.86rem;
    }

    .abyat-card .abyat-meta,
    .abt-card .abt-meta,
    .svcl-card .svcl-meta,
    .svcp-card .svcp-meta,
    .gal-card .gal-meta,
    .city-card .city-meta,
    .catl-card .catl-meta,
    .catp-card .catp-meta,
    .artl-card .artl-meta,
    .artp-card .artp-meta,
    .ctc-card .ctc-meta {
        font-size: 0.78rem;
    }

    .abyat-card .abyat-acat,
    .abt-card .abt-acat,
    .svcl-card .svcl-acat,
    .svcp-card .svcp-acat,
    .gal-card .gal-acat,
    .city-card .city-acat,
    .catl-card .catl-acat,
    .catp-card .catp-acat,
    .artl-card .artl-acat,
    .artp-card .artp-acat,
    .ctc-card .ctc-acat,
    .abyat-ph > .abyat-cat,
    .abt-ph > .abt-cat,
    .svcl-ph > .svcl-cat,
    .svcp-ph > .svcp-cat,
    .gal-ph > .gal-cat,
    .city-ph > .city-cat,
    .catl-ph > .catl-cat,
    .catp-ph > .catp-cat,
    .artl-ph > .artl-cat,
    .artp-ph > .artp-cat,
    .ctc-ph > .ctc-cat {
        padding: 0.3rem 0.7rem;
        font-size: 0.74rem;
    }

    .abyat-ft .abyat-more,
    .abt-ft .abt-more,
    .svcl-ft .svcl-more,
    .svcp-ft .svcp-more,
    .gal-ft .gal-more,
    .city-ft .city-more,
    .catl-ft .catl-more,
    .catp-ft .catp-more,
    .artl-ft .artl-more,
    .artp-ft .artp-more,
    .ctc-ft .ctc-more {
        font-size: 0.84rem;
    }

    .abyat-ft .abyat-gb,
    .abt-ft .abt-gb,
    .svcl-ft .svcl-gb,
    .svcp-ft .svcp-gb,
    .gal-ft .gal-gb,
    .city-ft .city-gb,
    .catl-ft .catl-gb,
    .catp-ft .catp-gb,
    .artl-ft .artl-gb,
    .artp-ft .artp-gb,
    .ctc-ft .ctc-gb {
        padding: 0.45rem 0.75rem;
        font-size: 0.8rem;
    }
}

@media (max-width: 420px) {
    .abyat-card .abyat-cb,
    .abt-card .abt-cb,
    .svcl-card .svcl-cb,
    .svcp-card .svcp-cb,
    .gal-card .gal-cb,
    .city-card .city-cb,
    .catl-card .catl-cb,
    .catp-card .catp-cb,
    .artl-card .artl-cb,
    .artp-card .artp-cb,
    .ctc-card .ctc-cb {
        padding: 1rem;
    }

    .abyat-card .abyat-cb h3,
    .abt-card .abt-cb h3,
    .svcl-card .svcl-cb h3,
    .svcp-card .svcp-cb h3,
    .gal-card .gal-cb h3,
    .city-card .city-cb h3,
    .catl-card .catl-cb h3,
    .catp-card .catp-cb h3,
    .artl-card .artl-cb h3,
    .artp-card .artp-cb h3,
    .ctc-card .ctc-cb h3 {
        font-size: 1.04rem;
    }

    .abyat-ft .abyat-gb,
    .abt-ft .abt-gb,
    .svcl-ft .svcl-gb,
    .svcp-ft .svcp-gb,
    .gal-ft .gal-gb,
    .city-ft .city-gb,
    .catl-ft .catl-gb,
    .catp-ft .catp-gb,
    .artl-ft .artl-gb,
    .artp-ft .artp-gb,
    .ctc-ft .ctc-gb {
        padding: 0.4rem 0.6rem;
        font-size: 0.76rem;
    }
}

.status-toast {
    position: fixed;
    z-index: 2000;
    top: max(16px, env(safe-area-inset-top));
    left: 50%;
    display: flex;
    align-items: center;
    gap: 12px;
    width: max-content;
    max-width: min(520px, calc(100vw - 32px));
    padding: 14px 16px;
    overflow: hidden;
    color: #f7fbf7;
    background: linear-gradient(135deg, #173b2a, #245b3d);
    border: 1px solid rgb(255 255 255 / 14%);
    border-radius: 14px;
    box-shadow: 0 14px 40px rgb(15 35 24 / 24%);
    font-family: inherit;
    text-align: start;
    direction: inherit;
    opacity: 0;
    transform: translate(-50%, calc(-100% - 24px));
    transition:
        opacity 300ms ease,
        transform 300ms cubic-bezier(0.2, 0.8, 0.2, 1);
    cursor: pointer;
}

.status-toast::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 3px;
    background: #a7d7a8;
    content: "";
    transform: scaleX(0);
    transform-origin: right;
}

.status-toast.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

.status-toast.is-visible::after {
    animation: status-toast-countdown 10s linear forwards;
}

.status-toast.is-dismissing {
    opacity: 0;
    transform: translate(-50%, calc(-100% - 24px));
    pointer-events: none;
}

.status-toast__icon {
    display: grid;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    place-items: center;
    color: #173b2a;
    background: #a7d7a8;
    border-radius: 50%;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
}

.status-toast__message {
    flex: 1;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.status-toast__close {
    display: grid;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    padding: 7px;
    place-items: center;
    color: inherit;
    background: transparent;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
}

.status-toast__close:hover,
.status-toast__close:focus-visible {
    background: rgb(255 255 255 / 14%);
}

.status-toast__close:focus-visible {
    outline: 2px solid #a7d7a8;
    outline-offset: 2px;
}

.status-toast__close svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-width: 2;
}

@keyframes status-toast-countdown {
    to {
        transform: scaleX(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .status-toast {
        transition: none;
    }
}

.lgl-page {
    /* ---- theme colors: edit here ---- */
    --lg-g9: #12392b;
    --lg-g7: #1f6b4a;
    --lg-g5: #3f9a63;
    --lg-lime: #b7e35a;
    --lg-leaf: #6fcf8a;
    --lg-ink: #17261f;
    --lg-mute: #5d6f65;
    --lg-chip: #eef3ec;
    --lg-line: #e1e8e2;
    --lg-gold: #c9852b;
    --lg-offset: 24px;

    max-width: 1180px;
    margin-inline: auto;
    padding: 24px 16px 0;
    color: var(--lg-ink);
    font-family: var(
        --font-family,
        "Tajawal",
        system-ui,
        -apple-system,
        "Segoe UI",
        sans-serif
    );
}

/* ---------- hero ---------- */
.lgl-hero {
    position: relative;
    overflow: hidden;
    margin: 0 0 28px;
    padding: clamp(32px, 6vw, 64px) clamp(22px, 5vw, 56px);
    border-radius: 32px;
    color: #fff;
    background:
        radial-gradient(
            50% 70% at 12% 100%,
            rgba(63, 154, 99, 0.6),
            transparent
        ),
        linear-gradient(150deg, var(--lg-g9), var(--lg-g7));
}

.lgl-hero > *:not(.lgl-leaf) {
    position: relative;
    z-index: 1;
}

.lgl-leaf {
    position: absolute;
    z-index: 0;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
    animation: lgl-float 7s ease-in-out infinite alternate;
}

.lgl-leaf.l1 {
    width: 110px;
    left: 5%;
    top: 14%;
    color: var(--lg-leaf);
    opacity: 0.3;
}

.lgl-leaf.l2 {
    width: 60px;
    left: 30%;
    top: 10%;
    color: var(--lg-lime);
    opacity: 0.28;
    animation-delay: -2s;
}

.lgl-leaf.l3 {
    width: 150px;
    left: 12%;
    bottom: -28px;
    color: var(--lg-g5);
    opacity: 0.45;
    animation-delay: -4s;
}

@keyframes lgl-float {
    from {
        transform: translateY(-12px) rotate(-8deg);
    }

    to {
        transform: translateY(12px) rotate(4deg);
    }
}

.lgl-crumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    font-size: 0.92rem;
    opacity: 0.9;
}

.lgl-crumb a {
    color: inherit;
    text-decoration: none;
}

.lgl-crumb a:hover {
    color: var(--lg-lime);
}

.lgl-hero h1 {
    margin: 0 0 10px;
    font-size: clamp(2rem, 5vw, 3.2rem);
    font-weight: 800;
    line-height: 1.3;
    background: linear-gradient(
        270deg,
        #fff,
        var(--lg-lime) 60%,
        var(--lg-leaf)
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.lgl-lead {
    max-width: 54ch;
    margin: 0 0 18px;
    font-size: 1.05rem;
    line-height: 1.9;
    opacity: 0.92;
}

.lgl-hero p.lgl-updated {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 7px 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.25);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    font-size: 0.88rem;
}

.lgl-hero p.lgl-updated b {
    color: var(--lg-lime);
    font-weight: 700;
}

/* ---------- at a glance ---------- */
.lgl-glance {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 36px;
}

.lgl-gcard {
    padding: 22px;
    border-radius: 22px;
    background: #fff;
    border: 1px solid var(--lg-line);
    transition:
        transform 0.3s,
        box-shadow 0.3s;
}

.lgl-gicon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    border-radius: 15px;
    background: var(--lg-lime);
    color: var(--lg-g9);
}

.lgl-gicon svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lgl-gcard h2 {
    margin: 0 0 6px;
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--lg-g9);
}

.lgl-gcard p {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.8;
    color: var(--lg-mute);
}

/* ---------- layout (toc + content) ---------- */
.lgl-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 32px;
    align-items: start;
    padding-bottom: 80px;
}

/* ---------- table of contents ---------- */
.lgl-toc {
    position: sticky;
    top: var(--lg-offset);
    max-height: calc(100vh - (var(--lg-offset) * 2));
    overflow-y: auto;
    padding: 20px;
    border-radius: 24px;
    background: #fff;
    border: 1px solid var(--lg-line);
}

.lgl-toc h2 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--lg-g7);
}

.lgl-toc h2::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--lg-lime);
}

.lgl-toc ol {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: lgl-toc-counter;
}

.lgl-toc li {
    counter-increment: lgl-toc-counter;
}

.lgl-toc a {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 12px;
    color: var(--lg-ink);
    font-size: 0.95rem;
    text-decoration: none;
    transition:
        background 0.25s,
        color 0.25s;
}

.lgl-toc a::before {
    content: counter(lgl-toc-counter);
    min-width: 20px;
    color: var(--lg-g5);
    font-size: 0.8rem;
    font-weight: 800;
}

.lgl-toc a:hover {
    background: var(--lg-chip);
}

.lgl-toc a.is-active {
    background: var(--lg-g7);
    color: #fff;
}

.lgl-toc a.is-active::before {
    color: var(--lg-lime);
}

/* ---------- content ---------- */
.lgl-content {
    min-width: 0;
}

.lgl-intro {
    margin: 0 0 20px;
    padding: 20px 22px;
    border-radius: 22px;
    background: #fff;
    border: 1px solid var(--lg-line);
    border-inline-start: 5px solid var(--lg-lime);
    color: var(--lg-mute);
    font-size: 1.02rem;
    line-height: 2;
}

.lgl-section {
    margin-bottom: 20px;
    padding: clamp(20px, 3vw, 32px);
    border-radius: 24px;
    background: #fff;
    border: 1px solid var(--lg-line);
    scroll-margin-top: var(--lg-offset);
}

.lgl-section h2 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--lg-line);
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--lg-g9);
}

.lgl-section h2 .lgl-num {
    display: inline-grid;
    place-items: center;
    flex: none;
    min-width: 36px;
    height: 36px;
    border-radius: 12px;
    background: var(--lg-g7);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 800;
}

.lgl-section p {
    margin: 0 0 12px;
    color: var(--lg-ink);
    font-size: 1rem;
    line-height: 2;
}

.lgl-section p:last-child {
    margin-bottom: 0;
}

.lgl-section ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
}

.lgl-section ul li {
    position: relative;
    padding-inline-start: 34px;
    font-size: 1rem;
    line-height: 1.9;
}

.lgl-section ul li::before {
    content: "\2713";
    position: absolute;
    inset-inline-start: 0;
    top: 4px;
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--lg-chip);
    color: var(--lg-g7);
    font-size: 0.72rem;
    font-weight: 800;
}

.lgl-section strong {
    color: var(--lg-g9);
}

.lgl-note {
    margin-top: 12px;
    padding: 14px 18px;
    border-radius: 16px;
    background: #fbf3e4;
    border: 1px solid #f0dcb4;
    color: #7a5316;
    font-size: 0.95rem;
    line-height: 1.9;
}

/* ---------- contact card ---------- */
.lgl-contact-card {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 28px;
    border-radius: 22px;
    background: linear-gradient(135deg, var(--lg-g9), var(--lg-g7));
    color: #fff;
}

.lgl-contact-card p {
    position: relative;
    margin: 0;
    color: #fff;
}

.lgl-actions {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.lgl-btn,
.lgl-contact-card a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 11px 20px;
    border-radius: 14px;
    background: var(--lg-lime);
    color: var(--lg-g9);
    font-weight: 800;
    text-decoration: none;
    transition:
        filter 0.25s,
        background 0.25s;
}

.lgl-btn:hover,
.lgl-contact-card a:hover {
    filter: brightness(0.95);
}

.lgl-btn.is-ghost {
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #fff;
}

.lgl-btn.is-ghost:hover {
    background: rgba(255, 255, 255, 0.24);
    filter: none;
}

/* ---------- mobile toc toggle ---------- */
.lgl-toc-toggle {
    display: none;
}

.lgl-page a:focus-visible,
.lgl-page button:focus-visible {
    outline: 3px solid var(--lg-g7);
    outline-offset: 3px;
}

.lgl-hero a:focus-visible,
.lgl-contact-card a:focus-visible {
    outline-color: var(--lg-lime);
}

@media (hover: hover) {
    .lgl-gcard:hover {
        transform: translateY(-5px);
        box-shadow: 0 18px 36px rgba(18, 57, 43, 0.12);
    }
}

@media (max-width: 860px) {
    .lgl-glance {
        grid-template-columns: 1fr;
    }

    .lgl-layout {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .lgl-toc {
        position: static;
        max-height: none;
    }

    .lgl-toc-toggle {
        display: block;
        width: 100%;
        margin-bottom: 14px;
        padding: 14px 18px;
        border-radius: 16px;
        background: #fff;
        border: 1px solid var(--lg-line);
        color: var(--lg-g7);
        font-family: inherit;
        font-size: 1rem;
        font-weight: 800;
        text-align: start;
        cursor: pointer;
    }

    .lgl-toc {
        display: none;
        margin-bottom: 18px;
    }

    .lgl-toc.is-open {
        display: block;
    }
}

@media (prefers-reduced-motion: reduce) {
    .lgl-leaf {
        animation: none;
    }

    .lgl-gcard,
    .lgl-toc a,
    .lgl-btn {
        transition: none;
    }
}

@media print {
    .lgl-toc,
    .lgl-toc-toggle,
    .lgl-leaf,
    .lgl-glance {
        display: none;
    }

    .lgl-hero {
        background: none;
        color: #000;
        padding: 0 0 16px;
    }

    .lgl-hero h1 {
        background: none;
        -webkit-text-fill-color: #000;
        color: #000;
    }

    .lgl-layout {
        display: block;
    }

    .lgl-section,
    .lgl-intro {
        border: 0;
        padding-inline: 0;
        break-inside: avoid;
    }
}
@media (max-width: 640px) {
    .svcp-crumb,
    .artp-crumb {
        display: flex;
        flex-wrap: wrap;
        max-width: 320px;
    }
    .svcp-crumb a,
    .svcp-crumb span,
    .artp-crumb a,
    .artp-crumb span {
        white-space: nowrap;
        font-size: 12px;
    }
}

/* OFFER */
/* ===== FLOATING OFFERS (circle + details window) ===== */
.ofr {
    --of-g9: #12392b;
    --of-g9-rgb: 18, 57, 43;
    --of-g7: #1f6b4a;
    --of-g5: #3f9a63;
    --of-lime: #b7e35a;
    --of-leaf: #6fcf8a;
    --of-gold: #c9852b;
    --of-ink: #17261f;
    --of-mute: #5d6f65;
    --of-chip: #eef3ec;
    --of-line: #e1e8e2;
    /* extra lift so the circle rides above the back-to-top arrow (56px + 12px gap); applied only while that arrow is visible */
    --of-stack: 0px;
    font-family: var(
        --font-family,
        "Tajawal",
        system-ui,
        -apple-system,
        "Segoe UI",
        sans-serif
    );
}
.ofr[hidden] {
    display: none;
}
.ofr.has-up {
    --of-stack: 68px;
}
.ofr svg.i {
    width: 1.1em;
    height: 1.1em;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex: none;
}

/* floating circle */
.ofr-fab {
    position: fixed;
    left: 16px;
    bottom: calc(16px + var(--of-stack) + env(safe-area-inset-bottom, 0px));
    z-index: 45;
    width: 54px;
    height: 54px;
    border: 0;
    border-radius: 50%;
    padding: 0;
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 1.5rem;
    background: var(--of-lime);
    color: var(--of-g9);
    box-shadow: 0 10px 24px rgba(var(--of-g9-rgb), 0.3);
    transition:
        transform 0.2s,
        bottom 0.3s;
}
.ofr-fab:hover {
    transform: translateY(-3px);
}
.ofr-fab::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--of-lime);
    opacity: 0;
    animation: ofr-ring 2.4s ease-out infinite;
    pointer-events: none;
}
.ofr.is-seen .ofr-fab::before {
    display: none;
}
@keyframes ofr-ring {
    0% {
        transform: scale(1);
        opacity: 0.7;
    }
    70%,
    100% {
        transform: scale(1.8);
        opacity: 0;
    }
}
.ofr-count {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 22px;
    height: 22px;
    padding: 0 5px;
    display: grid;
    place-items: center;
    border-radius: 99px;
    border: 2px solid #fff;
    background: var(--of-gold);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1;
}
.ofr-fab:focus-visible,
.ofr-dlg :focus-visible {
    outline: 3px solid var(--of-g7);
    outline-offset: 3px;
}

/* window */
.ofr-scrim {
    position: fixed;
    inset: 0;
    z-index: 80;
    background: rgba(var(--of-g9-rgb), 0.55);
}
.ofr-scrim[hidden],
.ofr-dlg[hidden] {
    display: none;
}
.ofr-dlg {
    position: fixed;
    z-index: 81;
    left: 16px;
    bottom: calc(
        16px + var(--of-stack) + 64px + env(safe-area-inset-bottom, 0px)
    );
    width: min(400px, calc(100vw - 32px));
    max-height: calc(100vh - 150px);
    max-height: calc(100dvh - 150px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 28px;
    background: #fff;
    color: var(--of-ink);
    box-shadow: 0 30px 70px -20px rgba(0, 0, 0, 0.5);
    animation: ofr-in 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
}
@keyframes ofr-in {
    from {
        opacity: 0;
        transform: translateY(16px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
.ofr-head {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 22px;
    color: #fff;
    background: linear-gradient(135deg, var(--of-g9), var(--of-g7));
}
.ofr-head > div,
.ofr-x {
    position: relative;
    z-index: 1;
}
.ofr-leaf {
    position: absolute;
    left: -14px;
    bottom: -34px;
    width: 110px;
    color: var(--of-leaf);
    opacity: 0.25;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    pointer-events: none;
}
.ofr-head h2 {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 800;
}
.ofr-head p {
    margin: 2px 0 0;
    font-size: 0.85rem;
    color: var(--of-lime);
    font-weight: 700;
}
.ofr-x {
    width: 40px;
    height: 40px;
    flex: none;
    display: grid;
    place-items: center;
    border-radius: 50%;
    cursor: pointer;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.14);
}
.ofr-x:hover {
    background: var(--of-lime);
    color: var(--of-g9);
}
.ofr-tabs {
    display: flex;
    gap: 8px;
    padding: 14px 18px 0;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.ofr-tabs::-webkit-scrollbar {
    display: none;
}
.ofr-tabs[hidden] {
    display: none;
}
.ofr-tab {
    flex: none;
    padding: 8px 16px;
    border: 0;
    border-radius: 99px;
    cursor: pointer;
    background: var(--of-chip);
    color: var(--of-g7);
    font: inherit;
    font-size: 0.9rem;
    font-weight: 800;
    transition:
        background 0.2s,
        color 0.2s;
}
.ofr-tab[aria-selected="true"] {
    background: var(--of-g7);
    color: #fff;
}
.ofr-body {
    overflow-y: auto;
    padding: 18px 18px 20px;
}
.ofr-item[hidden] {
    display: none;
}
.ofr-item {
    animation: ofr-fade 0.35s both;
}
@keyframes ofr-fade {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}
.ofr-badge {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 99px;
    background: var(--of-lime);
    color: var(--of-g9);
    font-size: 0.85rem;
    font-weight: 800;
}
.ofr-item h3 {
    margin: 12px 0 6px;
    font-size: 1.3rem;
    font-weight: 800;
    line-height: 1.4;
    color: var(--of-g9);
}
.ofr-desc {
    margin: 0 0 12px;
    color: var(--of-mute);
    line-height: 1.9;
    font-size: 0.98rem;
}
.ofr-list {
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
    display: grid;
    gap: 8px;
}
.ofr-list li {
    position: relative;
    padding-inline-start: 30px;
    font-size: 0.95rem;
    line-height: 1.7;
}
.ofr-list li::before {
    content: "\2713";
    position: absolute;
    inset-inline-start: 0;
    top: 2px;
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--of-chip);
    color: var(--of-g7);
    font-size: 0.7rem;
    font-weight: 800;
}
.ofr-exp {
    margin-bottom: 16px;
    padding: 14px;
    border-radius: 18px;
    background: var(--of-chip);
}
.ofr-exp-top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    font-size: 0.92rem;
    color: var(--of-mute);
}
.ofr-exp-top svg {
    color: var(--of-g7);
}
.ofr-exp-top b {
    color: var(--of-ink);
    font-weight: 800;
}
.ofr-cd {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    text-align: center;
}
.ofr-cd div {
    padding: 8px 4px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid var(--of-line);
}
.ofr-cd b {
    display: block;
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1.2;
    color: var(--of-g9);
    font-variant-numeric: tabular-nums;
}
.ofr-cd small {
    font-size: 0.74rem;
    color: var(--of-mute);
}
.ofr-exp.is-soon .ofr-cd b {
    color: var(--of-gold);
}
.ofr-exp.is-soon .ofr-cd div {
    border-color: var(--of-gold);
}
.ofr-exp.is-ended .ofr-cd {
    opacity: 0.4;
}
.ofr-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px;
    border-radius: 16px;
    background: var(--of-g7);
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    transition: background 0.2s;
}
.ofr-cta:hover {
    background: var(--of-g9);
}
.ofr-item.is-ended .ofr-cta {
    pointer-events: none;
    opacity: 0.45;
}

@media (max-width: 560px) {
    .ofr-dlg {
        left: 0;
        right: 0;
        bottom: 0;
        width: auto;
        max-height: 88vh;
        max-height: 88dvh;
        border-radius: 28px 28px 0 0;
        padding-bottom: env(safe-area-inset-bottom, 0px);
        animation-name: ofr-sheet;
    }
}
@keyframes ofr-sheet {
    from {
        transform: translateY(100%);
    }
    to {
        transform: none;
    }
}
@media (prefers-reduced-motion: reduce) {
    .ofr-fab::before,
    .ofr-dlg,
    .ofr-item {
        animation: none;
    }
    .ofr-fab,
    .ofr-tab,
    .ofr-cta {
        transition: none;
    }
}

/* CSK IMAGE */
/* Center all article images */
figure.image {
    display: block;
    margin: 1.5rem auto;
    text-align: center;
}
figure.image img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
    cursor: zoom-in;
}

/* Lightbox */
.lb {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.88);
    padding: 16px;
}
.lb.is-open {
    display: flex;
}
.lb-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 8px;
    cursor: default;
}
.lb-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
}
.lb-close:hover {
    background: rgba(255, 255, 255, 0.3);
}
body.lb-lock {
    overflow: hidden;
}
figure.image {
    position: relative;
    /* keep the figure shrink-wrapped to the image so the badge sits on the image corner */
    width: fit-content;
    max-width: 100%;
}

/* CKEditor sets an inline width % on resized figures, so keep that working */
figure.image.image_resized {
    width: auto;
}

figure.image::after {
    content: "";
    position: absolute;
    bottom: 10px;
    left: 10px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.55)
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><line x1='21' y1='21' x2='16.5' y2='16.5'/><line x1='11' y1='8' x2='11' y2='14'/><line x1='8' y1='11' x2='14' y2='11'/></svg>")
        center / 20px no-repeat;
    pointer-events: none; /* taps go through to the image */
    transition: opacity 0.2s;
}

/* On desktop, show the badge only on hover; keep it always visible on touch devices */
@media (hover: hover) {
    figure.image::after {
        opacity: 0;
    }
    figure.image:hover::after {
        opacity: 1;
    }
}