/* Al Raya Core — Services grid */
.ar-svcs{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:20px}
.ar-svc{position:relative;display:flex;flex-direction:column;gap:30px;grid-column:span 4;min-height:540px;padding:40px;border-radius:30px;overflow:hidden;
  --svc-muted:#C5D5DF;--svc-line:rgba(255,255,255,.26);--svc-label:#FF6B75;--svc-cap:#9DB4C1;--svc-soft:rgba(255,255,255,.08);--svc-strong-bg:#fff;--svc-strong-fg:#0D3D57}
.ar-svc--w12{grid-column:span 12}
.ar-svc--w7{grid-column:span 7}
.ar-svc--w6{grid-column:span 6}
.ar-svc--w5{grid-column:span 5}
.ar-svc--w4{min-height:520px;padding:38px}

.ar-svc--navy{background:linear-gradient(150deg,#12506F 0%,#0A2F44 55%,#062030 100%);color:#fff}
.ar-svc--ink{background:radial-gradient(420px 300px at 100% 100%,rgba(230,61,73,.28),transparent 70%),#041621;color:#fff}
.ar-svc--red{background:linear-gradient(160deg,#F04B57 0%,#E63D49 45%,#C22E3D 100%);color:#fff;--svc-muted:#FFE9EA;--svc-line:rgba(255,255,255,.5);--svc-label:#fff;--svc-cap:#FFE3E5;--svc-soft:rgba(255,255,255,.2)}
.ar-svc--white{background:#fff;color:#082230;box-shadow:inset 0 0 0 1px rgba(8,34,48,.14);--svc-muted:#4A6170;--svc-line:rgba(8,34,48,.16);--svc-label:#C22E3D;--svc-cap:#5E7480;--svc-soft:#F4F0E9;--svc-strong-bg:#0D3D57;--svc-strong-fg:#fff}
.ar-svc--cream{background:#EAE4DA;color:#082230;--svc-muted:#4A6170;--svc-line:rgba(8,34,48,.18);--svc-label:#C22E3D;--svc-cap:#5E7480;--svc-soft:rgba(255,255,255,.6);--svc-strong-bg:#0D3D57;--svc-strong-fg:#fff}

.ar-svc__body{position:relative;padding-inline-end:56px}
.ar-svc__label{margin:0;font-family:var(--ar-mono,monospace);font-size:12px;font-weight:500;letter-spacing:.16em;line-height:1.5;text-transform:uppercase;color:var(--svc-label)}
.ar-svc__title{margin:16px 0 0;font-family:var(--ar-font,inherit);font-size:clamp(30px,3.05vw,44px);font-stretch:108%;font-weight:800;letter-spacing:-.04em;line-height:.98;color:inherit}
.ar-svc--w4 .ar-svc__title{margin-top:18px;font-size:clamp(26px,2.3vw,33px);line-height:1.03}
.ar-svc__text{margin:16px 0 0;max-width:400px;font-size:16.5px;line-height:1.5;color:var(--svc-muted)}
.ar-svc--w4 .ar-svc__text{max-width:none;line-height:1.55}
.ar-svc__chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;max-width:430px}
.ar-svc__chips li{display:inline-flex;align-items:center;min-height:32px;padding:5px 14px;border-radius:999px;border:1px solid var(--svc-line);font-size:13px;font-weight:600;line-height:1.3}

/* One real link per card; its ::after stretches over the whole card. */
.ar-svc__go{position:absolute;inset:0;z-index:2;border-radius:inherit;color:inherit}
.ar-svc__go:focus-visible{outline:3px solid currentColor;outline-offset:-7px}
.ar-svc__arrow{position:absolute;inset-inline-end:28px;top:28px;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;border:1.5px solid var(--svc-line);transition:transform .25s ease,background-color .25s ease,color .25s ease}
.ar-svc--w4 .ar-svc__arrow{inset-inline-end:24px;top:24px;width:48px;height:48px}
.ar-svc:hover .ar-svc__arrow{transform:rotate(45deg);background:var(--svc-strong-bg);color:var(--svc-strong-fg);border-color:transparent}
[dir=rtl] .ar-svc__arrow svg{transform:scaleX(-1)}

/* Visuals */
.ar-svc__visual{position:relative;margin-top:auto}
.ar-svc__cap{display:block;margin:0 0 12px;font-family:var(--ar-mono,monospace);font-size:10px;font-weight:500;letter-spacing:.14em;line-height:1.5;text-transform:uppercase;color:var(--svc-cap)}
.ar-svc__cap--real{margin:22px 0 0;text-align:end}
.ar-svc__cap--real i{display:inline-block;width:6px;height:6px;margin-inline-end:9px;border-radius:50%;background:var(--ar-red,#E63D49);vertical-align:1px}

.ar-svc__visual--shot img{display:block;width:100%;height:auto;border-radius:14px;transform:rotate(-3deg);box-shadow:0 40px 70px -20px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.18)}

.ar-vshop{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.ar-vshop .ar-svc__cap{grid-column:1/-1;margin:0}
.ar-vshop__item{display:block;padding:14px;border-radius:18px;background:var(--svc-soft)}
.ar-vshop__img{display:block;height:70px;border-radius:12px;background:linear-gradient(135deg,#E63D49,#FF9299)}
.ar-vshop__item+.ar-vshop__item .ar-vshop__img{background:linear-gradient(135deg,#0D3D57,#2A7BA3)}
.ar-vshop__l1,.ar-vshop__l2{display:block;height:9px;border-radius:5px;margin-top:14px;width:70%;background:color-mix(in srgb,currentColor 24%,transparent)}
.ar-vshop__l2{margin-top:8px;width:40%;opacity:.55}
.ar-vshop__buy{display:flex;align-items:center;justify-content:center;min-height:38px;margin-top:14px;border-radius:999px;background:var(--ar-red-btn,#DC3340);color:#fff;font-size:12.5px;font-weight:700}
.ar-vshop__item+.ar-vshop__item .ar-vshop__buy{background:#082230}

.ar-vsearch__q{display:flex;align-items:center;gap:12px;min-height:50px;padding:0 18px;border-radius:999px;background:var(--svc-soft);border:1px solid var(--svc-line);font-size:14px}
.ar-vsearch__q .ar-icon{opacity:.7}
.ar-vsearch__q i{width:1.5px;height:18px;margin-inline-start:-8px;background:var(--ar-red,#E63D49)}
.ar-vsearch__r{margin-top:12px;padding:16px 18px;border-radius:16px;background:rgba(230,61,73,.14);border:1px solid rgba(230,61,73,.6);box-shadow:0 20px 40px -18px rgba(230,61,73,.6)}
.ar-vsearch__r small{display:flex;justify-content:space-between;font-family:var(--ar-mono,monospace);font-size:9.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--svc-label)}
.ar-vsearch__r b{display:block;margin-top:7px;font-size:16px;letter-spacing:-.01em}
.ar-vsearch__sk{display:block;height:7px;width:92%;margin-top:9px;border-radius:4px;background:color-mix(in srgb,currentColor 16%,transparent)}

.ar-vfunnel{display:grid;gap:12px;margin-top:0;align-content:center}
.ar-vfunnel span:not(.ar-svc__cap){display:flex;align-items:center;min-height:60px;padding:0 18px;border-radius:14px;font-weight:700;font-size:14.5px}
.ar-vfunnel span:nth-child(1){width:100%;background:color-mix(in srgb,currentColor 17%,transparent)}
.ar-vfunnel span:nth-child(2){width:80%;background:color-mix(in srgb,currentColor 26%,transparent)}
.ar-vfunnel span:nth-child(3){width:60%;background:color-mix(in srgb,currentColor 36%,transparent)}
.ar-vfunnel span:nth-child(4){width:42%;background:#041621;color:#fff;box-shadow:0 18px 30px -12px rgba(4,22,33,.7)}
.ar-vfunnel .ar-svc__cap{margin:10px 0 0}

.ar-vcal{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.ar-vcal .ar-svc__cap{grid-column:1/-1;margin:0 0 6px}
.ar-vcal u{padding-bottom:6px;text-decoration:none;text-align:center;font-family:var(--ar-mono,monospace);font-size:9.5px;font-weight:500;letter-spacing:.14em;color:var(--svc-cap)}
.ar-vcal i{display:flex;align-items:flex-end;min-height:52px;padding:9px;border-radius:12px;background:var(--svc-soft);font-style:normal;font-size:11.5px;font-weight:600;line-height:1;color:var(--svc-muted)}
.ar-vcal i.a{background:var(--svc-strong-bg);color:var(--svc-strong-fg)}
.ar-vcal i.b{background:var(--ar-red,#E63D49);color:#fff}
.ar-vcal i.c{background:transparent;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,currentColor 70%,transparent);color:inherit}
.ar-vcal i.w2{grid-column:span 2}

.ar-vpal{min-height:150px;display:flex;flex-direction:column;justify-content:flex-end}
.ar-vpal__aa{position:absolute;inset-inline-end:-14px;bottom:34px;font-family:var(--ar-serif,Georgia,serif);font-style:italic;font-weight:400;font-size:176px;line-height:.8;letter-spacing:-.05em;color:var(--ar-red,#E63D49)}
.ar-svc--red .ar-vpal__aa{color:#fff}
.ar-vpal .ar-svc__cap{position:relative}
.ar-vpal__sw{position:relative;display:flex}
.ar-vpal__sw span{display:flex;align-items:flex-end;width:74px;height:92px;margin-inline-end:-12px;padding:10px;border-radius:12px;font-family:var(--ar-mono,monospace);font-size:9.5px;font-weight:500;letter-spacing:.06em;line-height:1.3;box-shadow:0 14px 24px -10px rgba(8,34,48,.45);transform:rotate(-4deg)}
.ar-vpal__sw span:nth-child(2){transform:rotate(2deg) translateY(-8px)}
.ar-vpal__sw span:nth-child(3){transform:rotate(-2deg)}
.ar-vpal__sw span:nth-child(4){transform:rotate(5deg) translateY(-6px)}

.ar-vflow{display:grid;gap:10px}
.ar-vflow .ar-svc__cap{margin:0 0 2px}
.ar-vflow div{position:relative;display:flex;align-items:center;gap:12px;min-height:48px;padding:0 16px 0 12px;border-radius:14px;background:var(--svc-soft);border:1px solid color-mix(in srgb,currentColor 13%,transparent);font-size:14.5px;font-weight:600}
.ar-vflow div+div::before{content:"";position:absolute;inset-inline-start:23px;top:-11px;height:11px;width:1.5px;background:color-mix(in srgb,currentColor 35%,transparent)}
.ar-vflow em{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;border:1.5px solid color-mix(in srgb,currentColor 55%,transparent)}
.ar-vflow .is-ai em{background:var(--ar-red,#E63D49);border-color:var(--ar-red,#E63D49);color:#fff}
.ar-vflow small{margin-inline-start:auto;font-family:var(--ar-mono,monospace);font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--svc-cap)}

/* Wide cards: copy on the left, visual on the right */
@media (min-width:1101px){
  .ar-svc--w7.ar-svc--v-project,.ar-svc--w7.ar-svc--v-image,.ar-svc--w7.ar-svc--v-funnel,.ar-svc--w12:not(.ar-svc--v-none){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,43%);column-gap:28px}
  .ar-svc--w7 .ar-svc__body,.ar-svc--w12 .ar-svc__body{padding-inline-end:0}
  .ar-svc--w7.ar-svc--v-project .ar-svc__visual,.ar-svc--w7.ar-svc--v-image .ar-svc__visual{align-self:end;margin-top:0;padding-top:96px}
  .ar-svc--w7.ar-svc--v-project .ar-svc__chips,.ar-svc--w7.ar-svc--v-image .ar-svc__chips{max-width:330px}
  .ar-svc--w7.ar-svc--v-funnel .ar-svc__body{display:flex;flex-direction:column}
  .ar-svc--w7.ar-svc--v-funnel .ar-svc__chips{margin-top:auto;padding-top:28px}
  .ar-svc--w7.ar-svc--v-funnel .ar-svc__visual{align-self:center;padding-top:44px;padding-inline-end:16px}
}
@media (max-width:1100px){
  .ar-svcs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ar-svc,.ar-svc--w5,.ar-svc--w6,.ar-svc--w4{grid-column:span 1;min-height:480px}
  .ar-svc--w7,.ar-svc--w12{grid-column:span 2;min-height:0}
  .ar-svc__visual--shot{max-width:460px;margin-inline-start:auto}
  .ar-vfunnel{max-width:420px}
}
@media (max-width:720px){
  .ar-svcs{grid-template-columns:minmax(0,1fr)}
  .ar-svc,.ar-svc--w7,.ar-svc--w12{grid-column:span 1;min-height:0;padding:28px 24px}
  .ar-svc__arrow,.ar-svc--w4 .ar-svc__arrow{inset-inline-end:18px;top:18px;width:46px;height:46px}
  .ar-vpal__aa{font-size:140px}
}