/* ===========================================
   CSS VARIABLES
   Core tokens riêng cho homepage, không phụ thuộc theme-style.css
   =========================================== */
:root {
  /* --- Core Colors --- */
  --c-dark: #0F0F0F;
  --c-dark-alt: #19171C; /* MỚI: Màu đen phụ dùng rất nhiều ở Text và Shadow */
  --c-dark-alt-rgb: 25, 23, 28; /* MỚI: Dùng cho các thẻ rgba(25,23,28, x) */
  
  --c-green: #ABF400;
  --c-green-hover: #9AE000;
  --c-white: #FFFFFF;
  --c-white-rgb: 255, 255, 255; /* MỚI: Dùng cho các thẻ rgba(255,255,255, x) */
  
  --c-gray60: rgba(var(--c-dark-alt-rgb), 0.60);
  --c-gray52: rgba(var(--c-dark-alt-rgb), 0.52); /* MỚI */
  --c-gray44: rgba(var(--c-dark-alt-rgb), 0.44);
  --c-gray16: rgba(128, 128, 128, 0.16);
  --c-gray08: rgba(128, 128, 128, 0.08);
  
  --c-bg-light: #F2F1F3;
  --c-bg-soft: #F5F5F5;
  --c-bg-soft-alt: #EFEFEF;
  --c-bg-soft-line: #E8E8E8;
  --c-bg-soft-border: #EDEDED;
  --c-bg-card-light: #f4f5f6; /* MỚI: Nền xám nhạt cho thẻ Card (Offer) */
  --c-bg-card-gray: #f5f4f5; /* MỚI: Nền xám cho thẻ Industry */
  
  --c-bg-dark-section: #111111;
  --c-bg-dark-card: #1b1b1b;
  --c-bg-dark-card-alt: #1a1a1a;
  --c-bg-input: #242126;
  
  --c-text-blog: #0D0D0D;
  --c-text-muted-hp: #808080;
  --c-text-muted-2: #8C8C8C;
  --c-text-muted-3: #919191;
  --c-text-muted-4: #6A6A6A;
  
  --c-border-white-08: rgba(var(--c-white-rgb), 0.08);
  --c-border-white-10: rgba(var(--c-white-rgb), 0.10);
  --c-border-white-06: rgba(var(--c-white-rgb), 0.06);
  --c-border-white-05: rgba(var(--c-white-rgb), 0.05);
  --c-bg-white-04: rgba(var(--c-white-rgb), 0.04);
  
  --c-text-white-80: rgba(var(--c-white-rgb), 0.80);
  --c-text-white-72: rgba(var(--c-white-rgb), 0.72);
  --c-text-white-62: rgba(var(--c-white-rgb), 0.62);
  --c-text-white-60: rgba(var(--c-white-rgb), 0.60);
  --c-text-white-58: rgba(var(--c-white-rgb), 0.58);
  --c-text-white-24: rgba(var(--c-white-rgb), 0.24);
  
  --c-star: #FFD04D;
  --c-accent-blue: #2293FF;
  --c-accent-blue-2: #37A8FF;
  --c-accent-blue-3: #0D7CFF;
  --c-accent-purple: #715CF8;
  --c-accent-purple-soft: #EBE7FF;
  --c-accent-purple-mid: #BDA8FF;
  --c-accent-red: #FF4B4B;
  --c-accent-yellow-soft: #F9CF69;
  --c-accent-peach: #F5CFC9;
  --c-accent-lavender: #C9CCE0;
  --c-accent-sand: #EECDA2;
  --c-accent-violet: #D0ABF1;

  /* --- Typography --- */
  --font: 'Archivo', sans-serif;
  --fw-medium: 500;
  --fw-bold: 700;
  --fw-extrabold: 800;

  /* --- Layout --- */
  --container-max: 1224px;
  --container-pad: clamp(15px, 4vw, 80px);
  --max-w: var(--container-max);

  /* --- Border Radius --- */
  --radius-lg: 32px;
  --radius-md: 12px;
  --radius-pill: 999px;
  --radius-card: 24px;
  --radius-card-lg: 28px;

  /* --- Heading chung --- */
  --hp-heading-size: 48px;
  --hp-heading-weight: var(--fw-extrabold);
  --hp-heading-line: 56px;
  --hp-heading-tracking: -0.04em;

  /* --- Section padding --- */
  --hp-section-pad: 120px;
  --hp-section-pad-sm: 80px;
}

html,
body,
button,
input,
textarea,
select {
  font-family: inherit;
}

/* Home page */
#homepage-360 { position: relative; z-index: 1; font-family: var(--font); color: var(--c-dark); overflow-x: hidden; background: transparent; }
#homepage-360 *, #homepage-360 *::before, #homepage-360 *::after { box-sizing: border-box; }
#homepage-360 section { margin: 0; padding: 0; }
body.page-template-front-page { background: var(--c-white); }

/* ===========================================
   HERO
   =========================================== */
#homepage-360 .sec-hero { position: relative; width: min(var(--container-max), calc(100% - (var(--container-pad) * 2))); max-width: none; margin: 0 auto; padding: 60px 0 0; text-align: center; overflow: hidden; }
#homepage-360 .sec-hero__gradient { display: none; }
#homepage-360 .sec-hero__ellipse { position: absolute; width: 520px; border-radius: var(--radius-pill); filter: blur(104px); opacity: 0.82; }
#homepage-360 .sec-hero__ellipse--yellow { height: 118px; right: 28px; top: 10px; background: rgba(255, 184, 0, 0.43); }
#homepage-360 .sec-hero__ellipse--red { height: 220px; left: 50%; top: -8px; transform: translateX(-50%); background: rgba(233, 63, 63, 0.43); }
#homepage-360 .sec-hero__ellipse--blue { height: 150px; left: 26px; top: 12px; background: rgba(63, 100, 233, 0.43); }
#homepage-360 .sec-hero__content { position: relative; z-index: 1; max-width: var(--max-w); margin: 0 auto; }
#homepage-360 > section > [class$="__container"] { width: min(var(--container-max), calc(100% - (var(--container-pad) * 2))); max-width: none; margin-left: auto; margin-right: auto; }
#homepage-360 .sec-hero__titles { display: flex; flex-direction: column; align-items: center; gap: 8px; }
#homepage-360 .sec-hero__breakthrough { font-size: clamp(58px, 8vw, 100px); font-weight: var(--fw-extrabold); text-transform: uppercase; line-height: 0.9; letter-spacing: -0.06em; color: var(--c-dark); }
#homepage-360 .sec-hero__creative { margin-top: 0; font-size: clamp(68px, 9.5vw, 120px); font-weight: var(--fw-extrabold); text-transform: uppercase; line-height: 0.9; letter-spacing: -0.06em; color: var(--c-green); vertical-align: top; overflow: hidden; height: 0.9em; position: relative; display: inline-block; min-width: 11ch; text-align: center; perspective: 400px; }
#homepage-360 .sec-hero__breakthrough { position: relative; display: inline-block; }
#homepage-360 .sec-hero__creative { position: relative; min-height: 1em; }
#homepage-360 .sec-hero__creative-item { position: absolute; left: 0; top: 0; width: 100%; text-align: center; white-space: nowrap; display: block; color: var(--c-green); transform-origin: 50% 50% -30px; backface-visibility: hidden; opacity: 0; transform: rotateX(-90deg); }
#homepage-360 .sec-hero__creative-item:first-child { opacity: 1; transform: rotateX(0deg); }
#homepage-360 .sec-hero__desc { font-size: clamp(18px, 2vw, 24px); font-weight: 400; line-height: 1.333; color: var(--c-gray60); max-width: 760px; margin-left: auto; margin-right: auto; }

/* ===========================================
   SLIDER
   =========================================== */
#homepage-360 .sec-slider { padding: 40px 0 0; overflow: hidden; }
#homepage-360 .sec-slider .slider-hero { width: 100vw; max-width: none; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); overflow: hidden; padding: 0 0 10px; }
#homepage-360 .sec-slider .swiper-wrapper { align-items: center; transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1); }
#homepage-360 .sec-slider .swiper-slide { transition: opacity 0.7s ease, transform 0.7s ease; opacity: 1; }
#homepage-360 .sec-slider .swiper-slide .sec-slider__card { transform-origin: center center; transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1), filter 0.7s ease; transform: scale(1); }
#homepage-360 .sec-slider .swiper-slide-active,
#homepage-360 .sec-slider .swiper-slide-duplicate-active { opacity: 1; z-index: 3; }
#homepage-360 .sec-slider .swiper-slide-active .sec-slider__card,
#homepage-360 .sec-slider .swiper-slide-duplicate-active .sec-slider__card { transform: translateY(0) scale(1); filter: none; }
#homepage-360 .sec-slider .swiper-slide-prev,
#homepage-360 .sec-slider .swiper-slide-next,
#homepage-360 .sec-slider .swiper-slide-duplicate-prev,
#homepage-360 .sec-slider .swiper-slide-duplicate-next { opacity: 0.78; z-index: 2; }
#homepage-360 .sec-slider__card { aspect-ratio: 16 / 9; height: 540px; border-radius: 20px; overflow: hidden; background: #e9eff7; border: 1px solid var(--c-gray08); color: var(--c-dark-alt); }
#homepage-360 .sec-slider__mockup { width: 100%; height: 100%; padding: 18px 20px; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; }
#homepage-360 .sec-slider__card--image .sec-slider__mockup { padding: 0; display: block; }
#homepage-360 .sec-slider__card--image .sec-slider__visual--image { width: 100%; height: 100%; }
#homepage-360 .sec-slider__card--image .sec-slider__visual--image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center center; }
#homepage-360 .sec-slider__topbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 9px; font-weight: 600; line-height: 1; color: var(--c-text-white-62); position: relative; z-index: 2; }
#homepage-360 .sec-slider__topbar span:last-child { min-width: 54px; padding: 7px 12px; border-radius: var(--radius-pill); text-align: center; background: var(--c-text-white-62); }
#homepage-360 .sec-slider__body { position: relative; z-index: 2; min-height: 420px; display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(160px, 1fr); align-items: center; gap: 10px; }
#homepage-360 .sec-slider__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
#homepage-360 .sec-slider__eyebrow { font-size: 10px; font-weight: var(--fw-bold); line-height: 1; color: var(--c-gray52); }
#homepage-360 .sec-slider__copy h3 { margin: 0; max-width: 330px; font-size: clamp(24px, 2.4vw, 42px); font-weight: var(--fw-medium); line-height: 0.98; letter-spacing: -0.04em; }
#homepage-360 .sec-slider__copy a { padding: 10px 16px; border-radius: var(--radius-pill); background: var(--c-dark-alt); color: var(--c-white); font-size: 10px; line-height: 1; font-weight: var(--fw-bold); text-decoration: none; }
#homepage-360 .sec-slider__visual { height: 390px; position: relative; }
#homepage-360 .sec-slider__shape { position: absolute; display: block; }
#homepage-360 .sec-slider__shape--one { width: 230px; height: 280px; left: 50%; top: 18px; transform: translateX(-50%); border-radius: 52% 48% 42% 58%; background: linear-gradient(145deg, rgba(255,255,255,0.96), rgba(164,180,196,0.6)); box-shadow: inset 20px 20px 40px rgba(255,255,255,0.9), inset -18px -18px 34px rgba(64,82,98,0.2), 0 28px 48px rgba(48,66,80,0.16); }
#homepage-360 .sec-slider__shape--two { width: 126px; height: 156px; left: 42px; bottom: 22px; border: 1px solid rgba(var(--c-dark-alt-rgb), 0.12); border-radius: 50%; transform: rotate(-24deg); }
#homepage-360 .sec-slider__shape--three { width: 58px; height: 58px; right: 34px; top: 36px; background: var(--c-dark-alt); clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%); }
#homepage-360 .sec-slider__meta { max-width: 250px; font-size: 10px; font-weight: var(--fw-medium); line-height: 1.4; color: rgba(var(--c-dark-alt-rgb), 0.5); position: relative; z-index: 2; }
/* (Phần màu nền của các slide con tôi giữ nguyên vì nó là gradient vẽ hình khối đặc thù) */
#homepage-360 .sec-slider__card--smm { background: radial-gradient(circle at 80% 82%, #ee005b 0 7%, transparent 34%), #050505; color: var(--c-white); }
#homepage-360 .sec-slider__card--smm .sec-slider__topbar, #homepage-360 .sec-slider__card--smm .sec-slider__eyebrow, #homepage-360 .sec-slider__card--smm .sec-slider__meta { color: rgba(var(--c-white-rgb), 0.66); }
#homepage-360 .sec-slider__card--smm .sec-slider__topbar span:last-child { background: rgba(var(--c-white-rgb), 0.1); }
#homepage-360 .sec-slider__card--smm .sec-slider__copy h3 { font-weight: var(--fw-extrabold); color: var(--c-white); }
#homepage-360 .sec-slider__card--smm .sec-slider__copy a { background: #ff005f; }
#homepage-360 .sec-slider__card--smm .sec-slider__shape--one { width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgba(255,0,96,0.92), rgba(255,0,96,0.08) 66%, transparent 68%); box-shadow: 0 0 0 18px rgba(255,0,96,0.12), inset 0 0 32px rgba(0,0,0,0.55); }
#homepage-360 .sec-slider__card--smm .sec-slider__shape--two { border-color: rgba(255,0,96,0.46); }
#homepage-360 .sec-slider__card--smm .sec-slider__shape--three { background: #ff005f; }
#homepage-360 .sec-slider__card--ai { background: radial-gradient(circle at 25% 28%, rgba(255,111,0,0.35), transparent 30%), linear-gradient(135deg, #1a0901 0%, #3e0b42 60%, #1e1743 100%); color: var(--c-white); }
#homepage-360 .sec-slider__card--ai .sec-slider__topbar, #homepage-360 .sec-slider__card--ai .sec-slider__eyebrow, #homepage-360 .sec-slider__card--ai .sec-slider__meta { color: rgba(var(--c-white-rgb), 0.68); }
#homepage-360 .sec-slider__card--ai .sec-slider__topbar span:last-child { background: rgba(var(--c-white-rgb), 0.13); }
#homepage-360 .sec-slider__card--ai .sec-slider__copy h3 { color: #dfd1ff; }
#homepage-360 .sec-slider__card--ai .sec-slider__copy a { background: #9d70ff; }
#homepage-360 .sec-slider__card--ai .sec-slider__shape--one { width: 286px; height: 214px; border-radius: var(--radius-card); background: rgba(var(--c-white-rgb), 0.16); box-shadow: inset 0 1px 0 rgba(var(--c-white-rgb), 0.3), 0 24px 70px rgba(0,0,0,0.28); transform: translateX(-50%) rotate(-9deg); }
#homepage-360 .sec-slider__card--ai .sec-slider__shape--two { width: 300px; height: 92px; left: 0; bottom: 18px; border: 0; border-radius: 16px; background: rgba(var(--c-white-rgb), 0.2); }
#homepage-360 .sec-slider__card--ai .sec-slider__shape--three { background: #bda1ff; }
#homepage-360 .sec-slider__card--commerce { background: linear-gradient(135deg, #eef7f2 0%, #e5f0ff 100%); }
#homepage-360 .sec-slider__card--commerce .sec-slider__shape--one { border-radius: 28px; background: linear-gradient(145deg, var(--c-white), #abd3ff); }
#homepage-360 .sec-slider__card--mobile { background: linear-gradient(135deg, #f8efe5 0%, #fff8d8 100%); }
#homepage-360 .sec-slider__card--mobile .sec-slider__shape--one { width: 180px; border-radius: 30px; background: linear-gradient(180deg, var(--c-dark-alt), #525056); box-shadow: inset 0 0 0 8px rgba(var(--c-white-rgb), 0.1), 0 28px 48px rgba(var(--c-dark-alt-rgb), 0.2); }

/* ===========================================
   HIGHLIGHT
   =========================================== */
#homepage-360 .sec-highlight { padding: 120px 15px 0; }
#homepage-360 .sec-highlight__container { max-width: var(--max-w); margin: 0 auto; display: flex; gap: 24px; }
#homepage-360 .sec-highlight__item { flex: 1; padding: 40px 20px; background: var(--c-green); border-radius: var(--radius-lg); text-align: center; display: flex; flex-direction: column; gap: 12px; align-items: center; }
#homepage-360 .sec-highlight__number { font-size: 48px; font-weight: var(--fw-extrabold); text-transform: uppercase; line-height: 56px; }
#homepage-360 .sec-highlight__label { font-size: 18px; font-weight: 400; line-height: 26px; }

/* ===========================================
   WHAT WE OFFER
   =========================================== */
#homepage-360 .sec-offer { padding: 120px 15px 0; }
#homepage-360.about-360 .sec-offer { padding: 120px 15px ; }
#homepage-360 .sec-offer__container { max-width: var(--max-w); margin: 0 auto; }
#homepage-360 .sec-offer__heading { font-size: 48px; font-weight: var(--fw-extrabold); line-height: 56px; margin-bottom: 40px; letter-spacing: -0.04em; }
#homepage-360 .sec-offer__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
#homepage-360 .sec-offer__card { min-height: 256px; padding: 32px; border-radius: 40px 24px 40px 40px; background: var(--c-bg-card-light); display: flex; flex-direction: column; align-items: flex-start; gap: 16px; position: relative; transition: background 0.35s cubic-bezier(0.22, 1, 0.36, 1), transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease; cursor: pointer; }
#homepage-360 .sec-offer__card:hover { background: var(--c-dark); }
#homepage-360 .sec-offer__card:hover .sec-offer__card-arrow { background: var(--c-green); color: var(--c-dark); }
#homepage-360 .sec-offer__card:hover .sec-offer__card-title,
#homepage-360 .sec-offer__card:hover .sec-offer__card-desc { color: var(--c-white); }
#homepage-360 .sec-offer__card-cutout { position: absolute; top: -1px; right: -1px; width: 90px; height: 67px; background-color: var(--c-white); border-bottom-left-radius: 32px; border-top-right-radius: 24px; z-index: 2; transition: background-color 0.35s ease; }
#homepage-360 .sec-offer__card-cutout::before, #homepage-360 .sec-offer__card-cutout::after { content: ""; position: absolute; width: 24px; height: 24px; background: radial-gradient(circle at 0 100%, transparent 23.5px, var(--c-white) 24px); }
#homepage-360 .sec-offer__card-cutout::before { top: 1px; left: -24px; }
#homepage-360 .sec-offer__card-cutout::after { bottom: -24px; right: 1px; }
#homepage-360 .sec-offer__card-arrow { width: 80px; height: 60px; background: var(--c-bg-card-light); color: var(--c-dark); display: flex; align-items: center; justify-content: center; position: absolute; z-index: 3; top: 0; right: 0; border-radius: 24px; transition: transform 0.35s ease, background 0.35s ease; }
#homepage-360 .sec-offer__card-arrow svg { width: 20px; height: 20px; }
#homepage-360 .sec-offer__card-icon--custom { background: transparent; box-shadow: none; display: inline-flex; align-items: center; justify-content: center; }
#homepage-360 .sec-offer__card-icon--custom svg { width: 100%; height: 100%; display: block; }
#homepage-360 .sec-offer__card-title { margin: 0; font-size: 24px; font-weight: var(--fw-bold); line-height: 32px; color: var(--c-dark); transition: color 0.35s ease; }
#homepage-360 .sec-offer__card-desc { margin: 0; font-size: 16px; font-weight: 400; line-height: 1.7; color: var(--c-gray60); transition: color 0.35s ease; }

/* ===========================================
   CTA BANNER
   =========================================== */
#homepage-360 .sec-cta { padding: 120px 15px; position: relative; }
#homepage-360 .sec-cta__container { max-width: var(--max-w); margin: 0 auto; padding: 60px 24px 50px; background: var(--c-dark); border-radius: 32px; display: flex; flex-direction: column; align-items: center; position: relative; z-index: 1; overflow: hidden; }
#homepage-360 .sec-cta__bg-text { font-size: 160px; font-weight: var(--fw-bold); color: var(--c-gray08); position: absolute; top: 80%; left: 50%; transform: translate(-50%,-50%); white-space: nowrap; pointer-events: none; }
#homepage-360 .sec-cta__heading { text-align: center; font-size: 48px; font-weight: var(--fw-extrabold); line-height: 56px; }
#homepage-360 .sec-cta__green { color: var(--c-green); }
#homepage-360 .sec-cta__white { color: var(--c-white); }
#homepage-360 .sec-cta__btn { margin-top: 40px; padding: 12px 28px; background: var(--c-green); border-radius: 100px; display: inline-flex; align-items: center; gap: 10px; font-size: 16px; font-weight: var(--fw-extrabold); color: var(--c-dark); text-decoration: none; transition: background 0.3s; }
#homepage-360 .sec-cta__btn:hover { background: var(--c-green-hover); }

/* ===========================================
   TECH STACK
   =========================================== */
#homepage-360 .sec-tech { padding: 0 15px 120px; background: var(--c-white); }
#homepage-360 .sec-tech__container { max-width: var(--max-w); margin: 0 auto; display: flex; gap: 60px; align-items: center; }
#homepage-360 .sec-tech__heading { font-size: 48px; font-weight: var(--fw-extrabold); line-height: 56px; }
#homepage-360 .sec-tech__desc { margin-top: 20px; font-size: 18px; font-weight: 400; line-height: 26px; color: var(--c-gray60); }
#homepage-360 .sec-tech__grid { --tech-bg: var(--c-white); --tech-card-bg: var(--c-white); --tech-card-border: rgba(128,128,128,0.22); --tech-shadow: none; --tech-icon-bg: transparent; flex: 0 0 516px; position: relative; overflow: hidden; height: 494px; padding: 0; border-radius: 0; background: var(--c-white); border: 0; box-shadow: none; display: grid; grid-template-columns: repeat(3, 161.33px); justify-content: flex-start; gap: 16px; }
#homepage-360 .sec-tech__mask { position: absolute; left: 0; right: 0; height: 56px; z-index: 4; pointer-events: none; }
#homepage-360 .sec-tech__mask--left { top: 0; background: linear-gradient(180deg, var(--c-white) 0%, rgba(var(--c-white-rgb),0) 100%); }
#homepage-360 .sec-tech__mask--right { bottom: 0; background: linear-gradient(0deg, var(--c-white) 0%, rgba(var(--c-white-rgb),0) 100%); }
#homepage-360 .sec-tech__column { --tech-offset: 0px; overflow: hidden; position: relative; height: 494px; }
#homepage-360 .sec-tech__track { height: max-content; display: flex; flex-direction: column; align-items: stretch; gap: 16px; will-change: transform; transform: translate3d(0, var(--tech-offset), 0); animation-timing-function: linear; animation-iteration-count: infinite; animation-play-state: running; }
#homepage-360 .sec-tech__grid:hover .sec-tech__track, #homepage-360 .sec-tech__column:hover .sec-tech__track, #homepage-360 .sec-tech__track:hover, #homepage-360 .sec-tech__item:hover ~ .sec-tech__track { animation-play-state: paused; }
#homepage-360 .sec-tech__column--1 .sec-tech__track { --tech-offset: -77px; animation-name: sec-tech-marquee-up; animation-duration: 34s; }
#homepage-360 .sec-tech__column--2 .sec-tech__track { --tech-offset: 0px; animation-name: sec-tech-marquee-down; animation-duration: 30s; }
#homepage-360 .sec-tech__column--3 .sec-tech__track { --tech-offset: -77px; animation-name: sec-tech-marquee-up; animation-duration: 42s; }
#homepage-360 .sec-tech__group { display: flex; flex-direction: column; align-items: stretch; gap: 16px; padding-bottom: 16px; }
#homepage-360 .sec-tech__item { min-width: 0; padding: 20px; border-radius: 20px; border: 1px solid var(--tech-card-border); background: var(--tech-card-bg); backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: var(--tech-shadow); display: flex; flex-direction: column; align-items: flex-start; gap: 16px; transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease; will-change: transform; transform: translate3d(0,0,0); }
#homepage-360 .sec-tech__item-icon { width: 50px; height: 50px; flex-shrink: 0; border-radius: 0; background: var(--tech-icon-bg); box-shadow: none; position: relative;  }
#homepage-360 .sec-tech__item-info { display: flex; flex-direction: column; gap: 4px; }
#homepage-360 .sec-tech__item-name { font-size: 16px; font-weight: var(--fw-bold); line-height: 24px; }
#homepage-360 .sec-tech__item-cat { font-size: 13px; font-weight: 400; line-height: 20px; color: var(--c-gray60); }
@keyframes sec-tech-marquee-up { from { transform: translate3d(0, var(--tech-offset), 0); } to { transform: translate3d(0, calc(-50% + var(--tech-offset)), 0); } }
@keyframes sec-tech-marquee-down { from { transform: translate3d(0, calc(-50% + var(--tech-offset)), 0); } to { transform: translate3d(0, var(--tech-offset), 0); } }
@media (prefers-color-scheme: dark) {
  #homepage-360 .sec-tech__item-name { color: var(--c-dark); } /* Assuming dark theme sets --c-dark to white somewhere else, otherwise keep #000 */
  #homepage-360 .sec-tech__item-cat { color: var(--c-text-white-62); }
  #homepage-360 .sec-tech__item-icon::before { color: var(--c-white); }
}

/* ===========================================
   BLOGS
   =========================================== */
#homepage-360 .sec-blogs { padding: 80px 15px; }
#homepage-360 .sec-blogs__container { max-width: var(--max-w); margin: 0 auto; }
#homepage-360 .sec-blogs__heading { font-size: 48px; font-weight: var(--fw-extrabold); line-height: 56px; margin-bottom: 48px; }
#homepage-360 .sec-blogs__slider { overflow: hidden; }
#homepage-360 .sec-blogs__list { align-items: stretch; }
#homepage-360 .sec-blogs__item { height: auto; display: flex; flex-direction: column; }
#homepage-360 .sec-blogs__cover { aspect-ratio: 1.6 / 1; border-radius: 16px; overflow: hidden; background: #e9e9eb; }
#homepage-360 .sec-blogs__cover img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.3s; }
#homepage-360 .sec-blogs__item:hover .sec-blogs__cover img { transform: scale(1.03); }
#homepage-360 .sec-blogs__info { padding: 20px 0; display: flex; flex-direction: column; gap: 12px; }
#homepage-360 .sec-blogs__item-title { font-size: 20px; font-weight: var(--fw-bold); line-height: 28px; color: var(--c-text-blog); margin: 0; }
#homepage-360 .sec-blogs__item-title a { color: inherit; text-decoration: none; }
#homepage-360 .sec-blogs__item-desc { font-size: 15px; font-weight: 400; line-height: 22px; color: var(--c-text-blog); min-height: 66px; margin: 0; }
#homepage-360 .sec-blogs__item-date { font-size: 12px; font-weight: 400; text-transform: uppercase; line-height: 16px; color: var(--c-text-muted-hp); }
#homepage-360 .sec-blogs__controls { margin-top: 20px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
#homepage-360 .sec-blogs__pagination { width: auto !important; display: flex; align-items: center; gap: 10px; position: static; }
#homepage-360 .sec-blogs__pagination .swiper-pagination-bullet { width: 8px; height: 8px; margin: 0 !important; background: #d9d9dd; opacity: 1; }
#homepage-360 .sec-blogs__pagination .swiper-pagination-bullet-active { background: var(--c-dark-alt); }
#homepage-360 .sec-blogs__arrows { display: flex; align-items: center; gap: 12px; }
#homepage-360 .sec-blogs__arrow { width: 48px; height: 48px; padding: 0; border: 0; border-radius: var(--radius-pill); background: var(--c-bg-light); color: var(--c-dark-alt); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.25s ease, opacity 0.25s ease; }
#homepage-360 .sec-blogs__arrow:hover { background: #E7E6E9; }
#homepage-360 .sec-blogs__arrow.swiper-button-disabled { opacity: 0.38; cursor: default; }

/* ===========================================
   WHY CHOOSE US (dark bg)
   =========================================== */
#homepage-360 .sec-why { padding: 120px 15px ; background: var(--c-bg-dark-section); }
#homepage-360 .sec-why__container { max-width: var(--max-w); margin: 0 auto; }
#homepage-360 .sec-why__heading { font-size: 48px; font-weight: var(--fw-extrabold); line-height: 56px; color: var(--c-white); margin-bottom: 34px; letter-spacing: -0.04em; }
#homepage-360 .sec-why__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
#homepage-360 .sec-why__item { min-height: 344px; padding: 28px 26px 24px; border-radius: 28px; border: 1px solid rgba(var(--c-white-rgb),0.07); background: var(--c-bg-dark-card); display: flex; flex-direction: column; gap: 22px; align-items: flex-start; transition: transform 0.3s ease, border-color 0.3s ease, background 0.3s ease; }
#homepage-360 .sec-why__item:hover { transform: translateY(-4px); border-color: rgba(var(--c-white-rgb),0.14); }
#homepage-360 .sec-why__item-icon { width: 62px; height: 62px; flex-shrink: 0; position: relative; }
#homepage-360 .sec-why__item-icon::before, #homepage-360 .sec-why__item-icon::after { content: ""; position: absolute; inset: 0; border-radius: 18px; }
#homepage-360 .sec-why__item:nth-child(1) .sec-why__item-icon::before { background: radial-gradient(circle at 30% 30%, #8f85ff 0%, #5645d4 58%, #2b225c 100%); transform: rotate(12deg); }
#homepage-360 .sec-why__item:nth-child(1) .sec-why__item-icon::after { inset: 12px 10px 10px 14px; background: linear-gradient(180deg, var(--c-white) 0%, rgba(var(--c-white-rgb),0.15) 100%); clip-path: polygon(24% 30%, 66% 12%, 62% 46%, 82% 48%, 38% 92%, 43% 58%, 20% 58%); }
#homepage-360 .sec-why__item:nth-child(2) .sec-why__item-icon::before { border-radius: 50%; background: radial-gradient(circle at 35% 35%, #80bcff 0%, #4a78ff 55%, #203a8c 100%); }
#homepage-360 .sec-why__item:nth-child(2) .sec-why__item-icon::after { inset: 10px; border-radius: 50%; border: 6px solid rgba(var(--c-white-rgb),0.3); border-left-color: rgba(var(--c-white-rgb),0.8); border-bottom-color: rgba(var(--c-white-rgb),0.8); }
#homepage-360 .sec-why__item:nth-child(3) .sec-why__item-icon::before { background: linear-gradient(135deg, #8db089 0%, #3f5d41 55%, #162218 100%); clip-path: path("M31 2C45 4 56 7 56 12V29C56 44 46 56 31 60C16 56 6 44 6 29V12C6 7 17 4 31 2Z"); }
#homepage-360 .sec-why__item:nth-child(3) .sec-why__item-icon::after { inset: 24px 12px 6px 28px; border-radius: 0 10px 16px 0; background: linear-gradient(180deg, #53ff4d 0%, #1d9c22 100%); transform: skewX(-4deg); box-shadow: -12px 0 0 0 rgba(var(--c-white-rgb),0.2); }
#homepage-360 .sec-why__item:nth-child(4) .sec-why__item-icon::before { inset: 8px 0 16px; background: linear-gradient(180deg, #9a7b61 0%, #4a3b31 100%); clip-path: polygon(50% 0%, 100% 34%, 50% 68%, 0% 34%); }
#homepage-360 .sec-why__item:nth-child(4) .sec-why__item-icon::after { inset: 22px 8px 0; background: linear-gradient(180deg, #ffcb95 0%, #ff7a12 100%); clip-path: polygon(50% 0%, 100% 34%, 50% 68%, 0% 34%); box-shadow: 0 -12px 0 0 rgba(var(--c-white-rgb),0.18); }
#homepage-360 .sec-why__item-info { display: flex; flex-direction: column; gap: 12px; }
#homepage-360 .sec-why__item-info h3 { font-size: 24px; font-weight: var(--fw-bold); line-height: 1.2; color: var(--c-white); margin: 0; }
#homepage-360 .sec-why__item-list { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 10px; color: var(--c-text-white-58); }
#homepage-360 .sec-why__item-list li { font-size: 15px; font-weight: 400; line-height: 1.55; }

/* ===========================================
   INDUSTRY EXPERTISE
   =========================================== */
#homepage-360 .sec-industry { padding: 120px 15px; background: var(--c-white); }
#homepage-360 .sec-industry__container { max-width: var(--max-w); margin: 0 auto; display: grid; grid-template-columns: 300px minmax(0, 1fr); align-items: center; gap: 56px; }
#homepage-360 .sec-industry__title-section { display: flex; flex-direction: column; align-items: flex-start; padding-top: 18px; margin-bottom: 0; }
#homepage-360 .sec-industry__heading { font-size: 48px; font-weight: var(--fw-extrabold); line-height: 56px; letter-spacing: -0.04em; color: var(--c-dark-alt); }
#homepage-360 .sec-industry__btn { padding: 12px 28px; background: var(--c-dark-alt); border-radius: var(--radius-pill); display: inline-flex; align-items: center; gap: 10px; font-size: 16px; font-weight: var(--fw-extrabold); line-height: 26px; color: var(--c-white); text-decoration: none; transition: opacity 0.3s; }
#homepage-360 .sec-industry__btn:hover { opacity: 0.85; }
#homepage-360 .sec-industry__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
#homepage-360 .sec-industry__item { min-height: 94px; padding: 14px 18px 14px 14px; border-radius: var(--radius-card); background: var(--c-bg-card-gray); border: 1px solid var(--c-gray08); display: flex; align-items: center; gap: 18px; text-align: left; transition: transform 0.25s ease, background 0.25s ease; }
#homepage-360 .sec-industry__item:hover { transform: translateY(-3px); background: #f1f0f1; }
#homepage-360 .sec-industry__item-icon { width: 70px; height: 70px; border-radius: 20px; background: var(--c-white); box-shadow: 0 10px 20px rgba(15, 15, 15, 0.06), inset 0 1px 0 rgba(var(--c-white-rgb),0.9); position: relative; flex-shrink: 0; }
#homepage-360 .sec-industry__item-icon::before, #homepage-360 .sec-industry__item-icon::after { content: ""; position: absolute; }
#homepage-360 .sec-industry__item:nth-child(1) .sec-industry__item-icon::before { inset: 16px 18px 17px 18px; background: radial-gradient(circle at 50% 60%, rgba(126, 232, 97, 0.75) 0%, rgba(126,232,97,0.12) 72%, transparent 100%); filter: blur(6px); }
#homepage-360 .sec-industry__item:nth-child(1) .sec-industry__item-icon::after { inset: 17px; background: linear-gradient(180deg, #d8f6cf 0%, #86d866 100%); clip-path: polygon(50% 0%, 100% 38%, 100% 100%, 0 100%, 0 38%); }
#homepage-360 .sec-industry__item:nth-child(2) .sec-industry__item-icon::before { inset: 15px; background: radial-gradient(circle at 50% 58%, rgba(255, 104, 177, 0.55) 0%, rgba(255,104,177,0.12) 72%, transparent 100%); filter: blur(7px); }
#homepage-360 .sec-industry__item:nth-child(2) .sec-industry__item-icon::after { inset: 18px 16px 18px 20px; background: linear-gradient(180deg, #ffd3e8 0%, #ff6cb3 100%); clip-path: polygon(0 8%, 100% 50%, 0 92%); }
#homepage-360 .sec-industry__item:nth-child(3) .sec-industry__item-icon::before { inset: 15px; background: radial-gradient(circle at 50% 58%, rgba(255, 122, 141, 0.55) 0%, rgba(255,122,141,0.12) 72%, transparent 100%); filter: blur(7px); }
#homepage-360 .sec-industry__item:nth-child(3) .sec-industry__item-icon::after { inset: 18px 15px 16px; background: linear-gradient(180deg, #ffdce3 0%, #ff7f98 100%); clip-path: path("M20 36C9 30 2 22 2 13C2 7 6 2 13 2C17 2 20 4 22 7C24 4 27 2 31 2C38 2 42 7 42 13C42 22 35 30 24 36L22 37L20 36Z"); }
#homepage-360 .sec-industry__item:nth-child(4) .sec-industry__item-icon::before { inset: 14px; background: radial-gradient(circle at 50% 58%, rgba(255, 181, 118, 0.6) 0%, rgba(255,181,118,0.16) 72%, transparent 100%); filter: blur(7px); }
#homepage-360 .sec-industry__item:nth-child(4) .sec-industry__item-icon::after { inset: 17px 16px; background: linear-gradient(180deg, #ffe7cb 0%, #ffb469 100%); clip-path: polygon(14% 18%, 90% 36%, 64% 90%, 8% 72%); }
#homepage-360 .sec-industry__item:nth-child(5) .sec-industry__item-icon::before { inset: 14px; background: radial-gradient(circle at 50% 58%, rgba(186, 132, 255, 0.6) 0%, rgba(186,132,255,0.16) 72%, transparent 100%); filter: blur(7px); }
#homepage-360 .sec-industry__item:nth-child(5) .sec-industry__item-icon::after { inset: 18px; background: linear-gradient(180deg, #ead8ff 0%, #a77fff 100%); border-radius: 14px; }
#homepage-360 .sec-industry__item:nth-child(6) .sec-industry__item-icon::before { inset: 14px; background: radial-gradient(circle at 50% 58%, rgba(195, 147, 255, 0.56) 0%, rgba(195,147,255,0.14) 72%, transparent 100%); filter: blur(7px); }
#homepage-360 .sec-industry__item:nth-child(6) .sec-industry__item-icon::after { inset: 19px 18px 17px; background: linear-gradient(180deg, #ecdfff 0%, #bb93ff 100%); clip-path: polygon(50% 0, 62% 34%, 100% 38%, 72% 60%, 80% 100%, 50% 76%, 20% 100%, 28% 60%, 0 38%, 38% 34%); }
#homepage-360 .sec-industry__item:nth-child(7) .sec-industry__item-icon::before { inset: 14px; background: radial-gradient(circle at 50% 58%, rgba(131, 233, 220, 0.6) 0%, rgba(131,233,220,0.16) 72%, transparent 100%); filter: blur(7px); }
#homepage-360 .sec-industry__item:nth-child(7) .sec-industry__item-icon::after { inset: 18px 14px 16px; background: linear-gradient(180deg, #dcfff8 0%, #76d8c9 100%); clip-path: polygon(0 56%, 12% 40%, 34% 40%, 44% 22%, 72% 22%, 86% 40%, 100% 40%, 100% 76%, 0 76%); }
#homepage-360 .sec-industry__item:nth-child(8) .sec-industry__item-icon::before { inset: 14px; background: radial-gradient(circle at 50% 58%, rgba(119, 171, 255, 0.6) 0%, rgba(119,171,255,0.16) 72%, transparent 100%); filter: blur(7px); }
#homepage-360 .sec-industry__item:nth-child(8) .sec-industry__item-icon::after { inset: 21px 18px 19px; background: linear-gradient(180deg, #d9e8ff 0%, #7aa7ff 100%); border-radius: var(--radius-pill); box-shadow: -14px 0 0 0 rgba(122,167,255,0.9), 14px 0 0 0 rgba(122,167,255,0.9); }
#homepage-360 .sec-industry__item span { font-size: 17px; font-weight: var(--fw-medium); line-height: 1.45; color: var(--c-dark-alt); }

/* ===========================================
   PORTFOLIO (dark bg)
   =========================================== */
#homepage-360 .sec-portfolio { padding: 40px 15px 120px; background: var(--c-bg-dark-section); position: relative; }
#homepage-360 .sec-portfolio__bg-gradient { position: absolute; inset: 0; overflow: hidden; pointer-events: none; opacity: 0.65; }
#homepage-360 .sec-portfolio__gradient-1, #homepage-360 .sec-portfolio__gradient-2, #homepage-360 .sec-portfolio__gradient-3 { position: absolute; border-radius: var(--radius-pill); filter: blur(118px); }
#homepage-360 .sec-portfolio__gradient-1 { width: 598px; height: 138px; right: 200px; top: -60px; background: rgba(255,184,0,0.43); }
#homepage-360 .sec-portfolio__gradient-2 { width: 598px; height: 263px; left: 50%; transform: translateX(-50%); top: -80px; background: rgba(233,63,63,0.43); }
#homepage-360 .sec-portfolio__gradient-3 { width: 598px; height: 179px; left: 175px; top: -60px; background: rgba(63,100,233,0.43); }
#homepage-360 .sec-portfolio__container { max-width: var(--max-w); margin: 0 auto; position: relative; z-index: 1; }
#homepage-360 .sec-portfolio__heading { font-size: 48px; font-weight: var(--fw-extrabold); line-height: 56px; color: var(--c-white); margin-bottom: 40px; letter-spacing: -0.03em; }
#homepage-360 .sec-portfolio__list { display: flex; flex-direction: column; gap: 18px; }
#homepage-360 .sec-portfolio__item, #homepage-360 .sec-portfolio__item--reverse { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); gap: 24px; align-items: stretch; padding: 14px; border-radius: 22px; background: var(--c-bg-dark-card-alt); border: 1px solid rgba(var(--c-white-rgb),0.06); box-shadow: inset 0 1px 0 rgba(var(--c-white-rgb),0.02); transform-origin: center top; will-change: transform; transition: transform 0.18s linear; color: inherit; text-decoration: none; cursor: pointer; }
#homepage-360 .sec-portfolio__item-info { min-height: 248px; padding: 20px 18px 18px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
#homepage-360 .sec-portfolio__item-cat { font-size: 11px; font-weight: 600; text-transform: uppercase; line-height: 18px; letter-spacing: 0; color: var(--c-text-white-58); }
#homepage-360 .sec-portfolio__item-title { font-size: 20px; font-weight: var(--fw-bold); line-height: 1.35; color: var(--c-white); max-width: 320px; }
#homepage-360 .sec-portfolio__item-desc { font-size: 14px; font-weight: 400; line-height: 1.65; color: rgba(var(--c-white-rgb),0.56); max-width: 345px; }
#homepage-360 .sec-portfolio__item-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
#homepage-360 .sec-portfolio__tag { height: 26px; padding: 0 12px; background: var(--c-border-white-08); border-radius: var(--radius-pill); display: inline-flex; align-items: center; font-size: 11px; font-weight: var(--fw-medium); color: rgba(var(--c-white-rgb),0.7); }
#homepage-360 .sec-portfolio__item-link { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; font-weight: var(--fw-extrabold); color: var(--c-green); text-decoration: none; margin-top: auto; transition: opacity 0.3s; }
#homepage-360 .sec-portfolio__item-link:hover { opacity: 0.8; }
#homepage-360 .sec-portfolio__item-cover { min-height: 248px; border-radius: 12px; overflow: hidden; background: #262626; }
#homepage-360 .sec-portfolio__item-cover img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s; }
#homepage-360 .sec-portfolio__item:hover .sec-portfolio__item-cover img { transform: scale(1.03); }
#homepage-360 .sec-portfolio__more { text-align: center; margin-top: 36px; }
#homepage-360 .sec-portfolio__more-btn { padding: 12px 28px; border: 1px solid rgba(var(--c-white-rgb),0.30); border-radius: 100px; display: inline-flex; align-items: center; gap: 10px; font-size: 16px; font-weight: var(--fw-extrabold); color: var(--c-white); text-decoration: none; transition: border-color 0.3s, background 0.3s; }
#homepage-360 .sec-portfolio__more-btn:hover { border-color: var(--c-white); background: var(--c-border-white-05); }

#homepage-360 .sec-why-visual { padding: 40px 15px 56px; background: var(--c-bg-soft); }
#homepage-360 .sec-why-visual__container { max-width: var(--max-w); margin: 0 auto; }
#homepage-360 .sec-why-visual__heading { margin: 0 0 40px; font-size: 48px; font-weight: var(--hp-heading-weight); line-height: 1.12; letter-spacing: var(--hp-heading-tracking); color: var(--c-dark); }
#homepage-360 .sec-why-visual__layout { display: grid; grid-template-columns: minmax(260px, 0.95fr) minmax(260px, 0.9fr) minmax(320px, 1.35fr); gap: 18px; align-items: stretch; }
#homepage-360 .sec-why-visual__photo, #homepage-360 .sec-why-visual__stat, #homepage-360 .sec-why-visual__rating { border-radius: 30px; overflow: hidden; }
#homepage-360 .sec-why-visual__photo { min-height: 394px; background: var(--c-bg-soft-line); }
#homepage-360 .sec-why-visual__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
#homepage-360 .sec-why-visual__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-content: start; }
#homepage-360 .sec-why-visual__stat { min-height: 122px; padding: 24px; background: var(--c-white); display: flex; flex-direction: column; justify-content: center; box-shadow: 0 10px 30px rgba(17, 17, 17, 0.04); }
#homepage-360 .sec-why-visual__stat strong { display: block; margin-bottom: 10px; font-size: 26px; font-weight: var(--fw-extrabold); line-height: 1; color: var(--c-bg-dark-section); }
#homepage-360 .sec-why-visual__stat span { display: block; max-width: 118px; font-size: 14px; line-height: 1.35; color: #4a4a4a; }
#homepage-360 .sec-why-visual__stat--ring { padding: 0; background: transparent; box-shadow: none; }
#homepage-360 .sec-why-visual__ring { --size: 122px; width: var(--size); height: var(--size); margin: auto; border-radius: 50%; background: conic-gradient(var(--c-accent-purple) calc(var(--progress) * 1%), var(--c-accent-purple-soft) 0); display: grid; place-items: center; }
#homepage-360 .sec-why-visual__ring-inner { width: calc(var(--size) - 14px); height: calc(var(--size) - 14px); border-radius: 50%; background: var(--c-white); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 12px; }
#homepage-360 .sec-why-visual__ring-inner strong { margin-bottom: 6px; }
#homepage-360 .sec-why-visual__ring-inner span { max-width: 86px; }
#homepage-360 .sec-why-visual__photo-wrap { display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 14px; }
#homepage-360 .sec-why-visual__photo--right { min-height: 304px; }
#homepage-360 .sec-why-visual__rating { width: min(280px, 100%); padding: 22px 26px; background: var(--c-white); display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 14px; row-gap: 4px; box-shadow: 0 10px 30px rgba(17, 17, 17, 0.04); }
#homepage-360 .sec-why-visual__rating-label { grid-column: 1 / -1; font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--c-text-muted-3); }
#homepage-360 .sec-why-visual__rating-brand { font-size: 24px; font-weight: var(--fw-bold); line-height: 1; color: var(--c-bg-dark-section); }
#homepage-360 .sec-why-visual__rating-stars { font-size: 18px; line-height: 1; letter-spacing: 1px; color: var(--c-accent-red); }
#homepage-360 .sec-why-visual__rating-score { grid-column: 2; font-size: 14px; font-weight: 600; line-height: 1.2; color: var(--c-text-muted-4); text-transform: uppercase; }

#homepage-360 .sec-services-cta { padding: 24px 15px 56px; background: var(--c-bg-light); }
#homepage-360 .sec-services-cta__container, #homepage-360 .sec-expertise__container { max-width: var(--max-w); margin: 0 auto; }
#homepage-360 .sec-services-cta__panel { position: relative; padding: 46px 24px 34px; border-radius: 24px; background: var(--c-bg-dark-card-alt); text-align: center; overflow: hidden; }
#homepage-360 .sec-services-cta__bg { position: absolute; left: 50%; bottom: -18px; transform: translateX(-50%); font-size: clamp(72px, 10vw, 108px); font-weight: var(--fw-extrabold); line-height: 0.9; color: var(--c-bg-white-04); white-space: nowrap; pointer-events: none; }
#homepage-360 .sec-services-cta__title { position: relative; z-index: 1; max-width: 640px; margin: 0 auto 28px; font-size: 54px; font-weight: var(--hp-heading-weight); line-height: 1.02; letter-spacing: -0.05em; color: var(--c-white); }
#homepage-360 .sec-services-cta__button { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 22px; border-radius: var(--radius-pill); background: var(--c-green); color: var(--c-dark); text-decoration: none; font-size: 16px; font-weight: var(--hp-heading-weight); transition: transform 0.25s, box-shadow 0.25s; }
#homepage-360 .sec-services-cta__button:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(183,255,0,0.22); }

#homepage-360 .sec-expertise { padding: 8px 15px 80px; background: var(--c-bg-light); }
#homepage-360 .sec-expertise__container { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr); gap: 42px; align-items: center; }
#homepage-360 .sec-expertise__heading { margin: 0 0 26px; font-size: 54px; font-weight: var(--fw-extrabold); line-height: 1.02; letter-spacing: -0.05em; color: var(--c-bg-dark-section); }
#homepage-360 .sec-expertise__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; }
#homepage-360 .sec-expertise__item { min-height: 58px; padding: 10px 18px 10px 12px; border-radius: var(--radius-pill); background: var(--c-bg-soft-alt); display: flex; align-items: center; gap: 12px; box-shadow: inset 0 0 0 1px rgba(17,17,17,0.03); }
#homepage-360 .sec-expertise__icon { width: 34px; height: 34px; border-radius: 50%; flex: 0 0 34px; display: inline-flex; align-items: center; justify-content: center; background: radial-gradient(circle at 30% 30%, var(--c-white) 0%, var(--c-accent-purple-soft) 38%, var(--c-accent-purple-mid) 100%); color: var(--c-accent-purple); font-size: 10px; font-weight: var(--fw-extrabold); letter-spacing: 0.04em; box-shadow: 0 6px 14px rgba(109,88,246,0.18); }
#homepage-360 .sec-expertise__label { font-size: 15px; font-weight: var(--fw-medium); line-height: 1.35; color: #181818; }
#homepage-360 .sec-expertise__visual-frame { position: relative; min-height: 356px; padding: 28px; border-radius: 28px; background: var(--c-bg-soft-alt); overflow: hidden; display: flex; align-items: center; justify-content: center; }
#homepage-360 .sec-expertise__visual-band { position: absolute; left: 0; right: 0; top: 50%; height: 192px; transform: translateY(-50%); background: var(--c-accent-yellow-soft); border-radius: 32px; }
#homepage-360 .sec-expertise__visual-frame img { position: relative; z-index: 1; width: min(100%, 250px); max-height: 340px; object-fit: contain; filter: drop-shadow(0 18px 32px rgba(17,17,17,0.16)); }

#homepage-360 .sec-services-stack { padding: 72px 15px 88px; background: var(--c-dark); }
#homepage-360 .sec-services-stack .sec-services-stack__container { max-width: var(--max-w); margin: 0 auto; }
#homepage-360 .sec-services-stack__heading { margin: 0 0 28px; font-size: 54px; font-weight: var(--hp-heading-weight); line-height: 1.02; letter-spacing: -0.05em; color: var(--c-white); }
#homepage-360 .sec-services-stack__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
#homepage-360 .sec-services-stack__item { min-height: 56px; padding: 10px 14px; border-radius: 14px; background: var(--c-bg-white-04); border: 1px solid var(--c-border-white-05); display: flex; align-items: center; gap: 12px; }
#homepage-360 .sec-services-stack__icon { width: 28px; height: 28px; border-radius: 10px; flex: 0 0 28px; display: inline-flex; align-items: center; justify-content: center; background: rgba(171,244,0,0.12); color: var(--c-green); font-size: 12px; font-weight: var(--hp-heading-weight); }
#homepage-360 .sec-services-stack__name { font-size: 14px; line-height: 1.35; color: var(--c-text-white-80); }

/* Services: work model section with 120px vertical rhythm */
#homepage-360 .sec-services-work { padding: var(--hp-section-pad) 15px 0; background: var(--c-bg-light); }
#homepage-360 .sec-services-work__container { max-width: var(--max-w); margin: 0 auto; }
#homepage-360 .sec-services-work__heading { margin: 0 0 40px; font-size: 54px; font-weight: var(--fw-extrabold); line-height: 1.02; letter-spacing: -0.05em; color: var(--c-bg-dark-section); }
#homepage-360 .sec-services-work__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
#homepage-360 .sec-services-work__card { border: 1px solid var(--c-bg-soft-line); border-radius: 18px; background: var(--c-white); overflow: hidden; box-shadow: 0 8px 24px rgba(17,17,17,0.03); }
#homepage-360 .sec-services-work__card-head { display: flex; align-items: flex-start; gap: 16px; padding: 18px 18px 16px; border-bottom: 1px solid var(--c-bg-soft-border); } /* used border-light var equivalent */
#homepage-360 .sec-services-work__icon { width: 36px; height: 36px; border-radius: 50%; flex: 0 0 36px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(180deg, var(--c-accent-blue-2) 0%, var(--c-accent-blue-3) 100%); color: var(--c-white); font-size: 16px; }
#homepage-360 .sec-services-work__intro h3 { margin: 0 0 6px; font-size: 28px; font-weight: var(--fw-bold); line-height: 1.12; color: #1b1b1b; }
#homepage-360 .sec-services-work__intro p { margin: 0; font-size: 14px; line-height: 1.55; color: #4f4f4f; }
#homepage-360 .sec-services-work__card-body { padding: 16px 16px 18px; }
#homepage-360 .sec-services-work__card-body h4, #homepage-360 .sec-services-work__note h5 { margin: 0 0 12px; font-size: 14px; font-weight: var(--fw-bold); line-height: 1.35; color: #202020; }
#homepage-360 .sec-services-work__chips { display: grid; gap: 8px; margin-bottom: 18px; }
#homepage-360 .sec-services-work__chips span { min-height: 28px; padding: 7px 12px; border-radius: 10px; background: #f2f2f2; display: flex; align-items: center; font-size: 13px; line-height: 1.35; color: #3b3b3b; }
#homepage-360 .sec-services-work__note { position: relative; padding: 16px 16px 14px; border: 1px solid var(--c-accent-blue); border-radius: 10px; background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%); }
#homepage-360 .sec-services-work__note-pin { position: absolute; top: -11px; left: 12px; width: 18px; height: 18px; border-radius: 50%; background: var(--c-accent-blue); box-shadow: 0 0 0 4px var(--c-bg-soft); }
#homepage-360 .sec-services-work__note ul { margin: 0; padding-left: 18px; display: grid; gap: 6px; }
#homepage-360 .sec-services-work__note li { font-size: 13px; line-height: 1.45; color: #2b2b2b; }

/* Services: contact section override */
body.page-template-page_services #homepage-360 .sec-contact { padding: 120px 15px; background: var(--c-bg-soft); }
body.page-template-page_services #homepage-360 .sec-contact__container { max-width: var(--max-w); padding: 20px; border-radius: 26px; background: var(--c-bg-dark-card-alt); color: var(--c-white); gap: 20px; box-shadow: none; }
body.page-template-page_services #homepage-360 .sec-contact__left { padding: 20px; }
body.page-template-page_services #homepage-360 .sec-contact__right { padding: 36px 28px; border-radius: 20px; background: var(--c-bg-white-04); border: 1px solid var(--c-border-white-06); }
body.page-template-page_services #homepage-360 .sec-contact__title h2,
body.page-template-page_services #homepage-360 .sec-contact__steps h3,
body.page-template-page_services #homepage-360 .sec-contact__field label,
body.page-template-page_services #homepage-360 .sec-contact__privacy,
body.page-template-page_services #homepage-360 .sec-contact__step p,
body.page-template-page_services #homepage-360 .sec-contact__phone-btn { color: var(--c-white); }
body.page-template-page_services #homepage-360 .sec-contact__title p,
body.page-template-page_services #homepage-360 .sec-contact__privacy,
body.page-template-page_services #homepage-360 .sec-contact__step p { color: var(--c-text-white-72); }
body.page-template-page_services #homepage-360 .sec-contact__field input,
body.page-template-page_services #homepage-360 .sec-contact__field select,
body.page-template-page_services #homepage-360 .sec-contact__field textarea { background: var(--c-bg-white-04); border: 1px solid var(--c-border-white-06); color: var(--c-white); }
body.page-template-page_services #homepage-360 .sec-contact__field input::placeholder,
body.page-template-page_services #homepage-360 .sec-contact__field textarea::placeholder { color: var(--c-text-white-24); }
body.page-template-page_services #homepage-360 .sec-contact__submit { background: var(--c-green); color: var(--c-dark); }
body.page-template-page_services #homepage-360 .sec-contact__submit span { color: inherit; }
body.page-template-page_services #homepage-360 .sec-contact__phone-btn { background: var(--c-white); color: var(--c-dark); border: 0; }
body.page-template-page_services #homepage-360 .sec-contact__step-num { background: var(--c-white); color: var(--c-dark); }

/* Portfolio: standalone page */
#homepage-360 { background: var(--c-white); }
#homepage-360 .portfolio-page__container { max-width: var(--max-w); margin: 0 auto; padding: 0 15px; }
#homepage-360 .portfolio-page__hero { padding: 32px 0 40px; }
#homepage-360 .portfolio-page__breadcrumb { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 34px; font-size: 13px; color: var(--c-text-muted-2); }
#homepage-360 .portfolio-page__breadcrumb a { color: var(--c-bg-dark-card); text-decoration: none; }
#homepage-360 .portfolio-page__topbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
#homepage-360 .portfolio-page__title { margin: 0; font-size: 64px; font-weight: var(--hp-heading-weight); line-height: 1; letter-spacing: -0.05em; color: var(--c-dark); }
#homepage-360 .portfolio-page__filters { display: flex; flex-wrap: wrap; gap: 10px; }
#homepage-360 .portfolio-page__filter { min-height: 40px; padding: 0 18px; border: 0; border-radius: var(--radius-pill); background: #f1f1f1; color: var(--c-text-muted-2); font-size: 14px; font-weight: var(--fw-medium); }
#homepage-360 .portfolio-page__filter.is-active { background: var(--c-bg-dark-card); color: var(--c-white); }

#homepage-360 .portfolio-page__grid-wrap { padding: 0 0 120px; }
#homepage-360 .portfolio-page__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px 28px; }
#homepage-360 .portfolio-page__card { display: flex; flex-direction: column; gap: 14px; color: inherit; text-decoration: none; cursor: pointer; }
#homepage-360 .portfolio-page__media { position: relative; min-height: 370px; border-radius: 18px; overflow: hidden; display: flex; align-items: center; justify-content: center; text-decoration: none; }
#homepage-360 .portfolio-page__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.35s ease; }
#homepage-360 .portfolio-page__media:hover img { transform: scale(1.03); }
#homepage-360 .portfolio-page__media--peach { background: var(--c-accent-peach); }
#homepage-360 .portfolio-page__media--lavender { background: var(--c-accent-lavender); }
#homepage-360 .portfolio-page__media--sand { background: var(--c-accent-sand); }
#homepage-360 .portfolio-page__media--violet { background: var(--c-accent-violet); }
#homepage-360 .portfolio-page__content { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
#homepage-360 .portfolio-page__category { font-size: 12px; font-weight: 600; line-height: 1.4; letter-spacing: 0.02em; text-transform: uppercase; color: #8c8c8c; }
#homepage-360 .portfolio-page__card-title { margin: 0; font-size: 21px; font-weight: var(--hp-heading-weight); line-height: 1.25; letter-spacing: -0.03em; color: var(--c-dark); }
#homepage-360 .portfolio-page__desc { margin: 0; font-size: 14px; line-height: 1.65; color: #7d7d7d; }
#homepage-360 .portfolio-page__tags { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 4px; }
#homepage-360 .portfolio-page__tag { min-height: 28px; padding: 0 12px; border-radius: var(--radius-pill); background: #f3f3f3; display: inline-flex; align-items: center; font-size: 11px; font-weight: var(--fw-medium); color: #8a8a8a; text-transform: uppercase; }
#homepage-360 .portfolio-page__link { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; font-size: 14px; font-weight: var(--hp-heading-weight); text-transform: uppercase; color: var(--c-dark); text-decoration: none; }
#homepage-360 .portfolio-page__link:hover { opacity: 0.8; }
#homepage-360 .portfolio-page__empty { margin: 48px 0 0; padding: 28px; border-radius: 16px; background: var(--c-bg-soft); color: var(--c-text-muted-2); font-size: 16px; line-height: 1.5; text-align: center; }
#homepage-360 .portfolio-page__pagination { margin-top: 56px; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 10px; }
#homepage-360 .portfolio-page__pagination-btn { min-width: 42px; height: 42px; padding: 0 14px; border: 0; border-radius: var(--radius-pill); background: #f1f1f1; color: var(--c-text-muted-2); font-family: var(--font); font-size: 14px; font-weight: var(--fw-bold); cursor: pointer; transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease; }
#homepage-360 .portfolio-page__pagination-btn:hover { background: #e7e7e7; transform: translateY(-1px); }
#homepage-360 .portfolio-page__pagination-btn.is-active { background: var(--c-bg-dark-card); color: var(--c-white); }

/* Blog page */
#blog-page {
  background: var(--c-white);
  color: var(--c-dark-alt);
  font-family: var(--font);
}

#blog-page *,
#blog-page *::before,
#blog-page *::after {
  box-sizing: border-box;
}

#blog-page .blog-360 {
  padding: 24px 15px 96px;
}

#blog-page .blog-360__container {
  max-width: var(--max-w);
  margin: 0 auto;
}

#blog-page .blog-360__heading {
  margin: 0 0 42px;
  color: var(--c-dark-alt);
  font-size: 48px;
  font-weight: var(--fw-extrabold);
  line-height: 1.05;
  letter-spacing: -0.03em;
}

#blog-page .blog-360__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 56px 28px;
}

#blog-page .blog-360__card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#blog-page .blog-360__media {
  display: block;
  aspect-ratio: 1.6 / 1;
  overflow: hidden;
  border-radius: 14px;
  background: #f1f1f1;
  text-decoration: none;
}

#blog-page .blog-360__media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 0.28s ease;
}

#blog-page .blog-360__card:hover .blog-360__media img {
  transform: scale(1.03);
}

#blog-page .blog-360__content {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#blog-page .blog-360__title {
  margin: 0;
  color: var(--c-dark-alt);
  font-size: 18px;
  font-weight: var(--fw-extrabold);
  line-height: 1.32;
}

#blog-page .blog-360__title a {
  color: inherit;
  text-decoration: none;
}

#blog-page .blog-360__title a:hover {
  opacity: 0.78;
}

#blog-page .blog-360__excerpt {
  margin: 0;
  color: rgba(var(--c-dark-alt-rgb), 0.72);
  font-size: 13px;
  line-height: 1.55;
}

#blog-page .blog-360__date {
  color: var(--c-text-muted-2);
  font-size: 10px;
  font-weight: var(--fw-medium);
  line-height: 1.4;
  text-transform: uppercase;
}

#blog-page .blog-360__load-more-wrap {
  margin-top: 56px;
  display: flex;
  justify-content: center;
}

#blog-page .blog-360__load-more {
  min-width: 158px;
  min-height: 42px;
  padding: 0 28px;
  border: 1px solid var(--c-dark-alt);
  border-radius: var(--radius-pill);
  background: var(--c-white);
  color: var(--c-dark-alt);
  font-family: var(--font);
  font-size: 13px;
  font-weight: var(--fw-extrabold);
  line-height: 18px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

#blog-page .blog-360__load-more:hover {
  background: var(--c-dark-alt);
  color: var(--c-white);
}

#blog-page .blog-360__load-more:disabled {
  cursor: default;
  opacity: 0.62;
}

#blog-page .blog-360__empty {
  margin: 0;
  padding: 28px;
  border-radius: 16px;
  background: var(--c-bg-soft);
  color: var(--c-text-muted-2);
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
}

@media (max-width: 991px) {
  #blog-page .blog-360__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 42px 22px;
  }
}

@media (max-width: 767px) {
  #blog-page .blog-360 {
    padding: 20px 14px 64px;
  }

  #blog-page .blog-360__heading {
    margin-bottom: 28px;
    font-size: 38px;
  }

  #blog-page .blog-360__grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  #blog-page .blog-360__load-more-wrap {
    margin-top: 42px;
  }

  #blog-page .blog-360__load-more {
    width: min(100%, 220px);
  }
}

/* Single blog */
.single-blog {
  background: var(--c-white);
  color: var(--c-dark-alt);
  font-family: var(--font);
}

.single-blog *,
.single-blog *::before,
.single-blog *::after {
  box-sizing: border-box;
}

.single-blog__container {
  width: min(100% - 30px, var(--max-w));
  margin: 0 auto;
}

.single-blog__breadcrumb {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 0 60px 0;
  color: var(--c-text-muted-2);
  font-size: 12px;
  line-height: 18px;
}

.single-blog__breadcrumb a {
  color: var(--c-dark-alt);
  text-decoration: none;
}

.single-blog__breadcrumb span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.single-blog__hero {
  max-width: 940px;
  margin: 0 auto 48px;
  text-align: center;
}

.single-blog__hero h1 {
  margin: 0;
  color: var(--c-dark-alt);
  font-size: 48px;
  font-weight: var(--fw-extrabold);
  line-height: 1.08;
  letter-spacing: -0.03em;
}

.single-blog__hero p {
  max-width: 860px;
  margin: 28px auto 0;
  color: var(--c-dark-alt);
  font-size: 20px;
  line-height: 1.45;
}

.single-blog__hero time {
  display: block;
  margin-top: 34px;
  color: var(--c-text-muted-2);
  font-size: 12px;
  font-weight: var(--fw-medium);
  line-height: 1.4;
  text-transform: uppercase;
}

.single-blog__cover {
  aspect-ratio: 2.86 / 1;
  overflow: hidden;
  border-radius: 28px;
  background: var(--c-bg-soft);
}

.single-blog__cover img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.single-blog__body {
  max-width: 930px;
  margin: 54px auto 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 76px;
  align-items: start;
}

.single-blog__content {
  min-width: 0;
  color: var(--c-dark-alt);
  font-size: 16px;
  line-height: 1.72;
}

.single-blog__content > *:first-child {
  margin-top: 0;
}

.single-blog__content p,
.single-blog__content ul,
.single-blog__content ol {
  margin: 0 0 24px;
}

.single-blog__content h2,
.single-blog__content h3 {
  margin: 32px 0 18px;
  color: var(--c-dark-alt);
  font-weight: var(--fw-extrabold);
  line-height: 1.18;
  letter-spacing: -0.02em;
}

.single-blog__content h2 {
  font-size: 30px;
}

.single-blog__content h3 {
  font-size: 24px;
}

.single-blog__content ul,
.single-blog__content ol {
  padding-left: 22px;
}

.single-blog__content li {
  margin-bottom: 8px;
}

.single-blog__content img {
  max-width: 100%;
  height: auto;
  border-radius: 18px;
}

.single-blog__aside {
  position: sticky;
  top: 96px;
  display: flex;
  flex-direction: column;
  gap: 34px;
}

.single-blog__toc h2 {
  margin: 0 0 26px;
  color: var(--c-dark-alt);
  font-size: 28px;
  font-weight: var(--fw-extrabold);
  line-height: 1.12;
  letter-spacing: -0.02em;
}

.single-blog__toc .toc-container {
  padding: 0;
  border: 0;
  background: transparent;
}

.single-blog__toc .toc-header {
  display: none;
}

.single-blog__toc .toc-list,
.single-blog__toc .toc-sublist {
  margin: 0;
  padding: 0;
  list-style: none;
}

.single-blog__toc .toc-list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.single-blog__toc .toc-sublist {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-top: 14px;
}

.single-blog__toc .toc-link {
  color: var(--c-text-muted-2);
  font-size: 14px;
  font-weight: var(--fw-medium);
  line-height: 1.45;
  text-decoration: none;
  transition: color 0.2s ease;
}

.single-blog__toc .toc-list > li:first-child > .toc-link,
.single-blog__toc .toc-link:hover {
  color: var(--c-dark-alt);
}

.single-blog__cta {
  padding: 40px 28px 32px;
  border-radius: 22px;
  background: var(--c-dark-alt);
  color: var(--c-white);
  text-align: center;
}

.single-blog__cta h2 {
  margin: 0;
  color: var(--c-white);
  font-size: 36px;
  font-weight: var(--fw-extrabold);
  line-height: 1.05;
  letter-spacing: -0.02em;
}

.single-blog__cta p {
  margin: 28px 0 30px;
  color: rgba(var(--c-white-rgb), 0.68);
  font-size: 18px;
  line-height: 1.4;
}

.single-blog__cta a {
  min-height: 48px;
  padding: 0 28px;
  border-radius: var(--radius-pill);
  background: var(--c-green);
  color: var(--c-dark-alt);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: var(--fw-extrabold);
  text-decoration: none;
  transition: background 0.2s ease, transform 0.2s ease;
}

.single-blog__cta a:hover {
  background: var(--c-green-hover);
  transform: translateY(-1px);
}

.single-blog__related {
  padding: 116px 0 96px;
}

.single-blog__related h2 {
  margin: 0 0 48px;
  color: var(--c-dark-alt);
  font-size: 40px;
  font-weight: var(--fw-extrabold);
  line-height: 1.1;
  letter-spacing: -0.03em;
}

.single-blog__related-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.single-blog__related .blog-360__card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.single-blog__related .blog-360__media {
  display: block;
  aspect-ratio: 1.6 / 1;
  overflow: hidden;
  border-radius: 14px;
  background: var(--c-bg-soft);
  text-decoration: none;
}

.single-blog__related .blog-360__media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 0.28s ease;
}

.single-blog__related .blog-360__card:hover .blog-360__media img {
  transform: scale(1.03);
}

.single-blog__related .blog-360__content {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.single-blog__related .blog-360__title {
  margin: 0;
  color: var(--c-dark-alt);
  font-size: 18px;
  font-weight: var(--fw-extrabold);
  line-height: 1.32;
  letter-spacing: 0;
}

.single-blog__related .blog-360__title a {
  color: inherit;
  text-decoration: none;
}

.single-blog__related .blog-360__title a:hover {
  opacity: 0.78;
}

.single-blog__related .blog-360__excerpt {
  margin: 0;
  color: rgba(var(--c-dark-alt-rgb), 0.72);
  font-size: 13px;
  line-height: 1.55;
}

.single-blog__related .blog-360__date {
  color: var(--c-text-muted-2);
  font-size: 10px;
  font-weight: var(--fw-medium);
  line-height: 1.4;
  text-transform: uppercase;
}

@media (max-width: 991px) {
  .single-blog__breadcrumb {
    padding-bottom: 42px;
  }

  .single-blog__hero h1 {
    font-size: 40px;
  }

  .single-blog__hero p {
    font-size: 18px;
  }

  .single-blog__body {
    max-width: 760px;
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .single-blog__aside {
    position: static;
  }

  .single-blog__related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .single-blog__container {
    width: calc(100% - 28px);
  }

  .single-blog__breadcrumb {
    padding-bottom: 30px;
  }

  .single-blog__hero {
    margin-bottom: 32px;
    text-align: left;
  }

  .single-blog__hero h1 {
    font-size: 34px;
  }

  .single-blog__hero p {
    margin-top: 20px;
    font-size: 17px;
  }

  .single-blog__hero time {
    margin-top: 24px;
  }

  .single-blog__cover {
    aspect-ratio: 16 / 10;
    border-radius: 18px;
  }

  .single-blog__body {
    margin-top: 36px;
  }

  .single-blog__content {
    font-size: 15px;
  }

  .single-blog__content h2 {
    font-size: 26px;
  }

  .single-blog__content h3 {
    font-size: 22px;
  }

  .single-blog__toc h2,
  .single-blog__related h2 {
    font-size: 30px;
  }

  .single-blog__related {
    padding: 72px 0 64px;
  }

  .single-blog__related-grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }
}

@media (min-width: 992px) {
  #homepage-360 .sec-portfolio__list { padding-bottom: 0; }
}

/* ===========================================
   CLIENTS REVIEW
   =========================================== */
#homepage-360 .sec-review { padding: 120px 15px; background: var(--c-bg-card-light); }
#homepage-360 .sec-review__container { max-width: var(--max-w); margin: 0 auto; }
#homepage-360 .sec-review__title-section { text-align: center; display: flex; flex-direction: column; align-items: center; max-width: 600px; margin: auto; padding-bottom: 48px; }
#homepage-360 .sec-review__heading { font-size: 48px; font-weight: var(--fw-extrabold); line-height: 56px; margin: 0; }
#homepage-360 .sec-review__sub { font-size: 18px; font-weight: 400; line-height: 26px; color: var(--c-gray60); max-width: 700px; }
#homepage-360 .sec-review__trusted { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
#homepage-360 .sec-review__trusted img { height: 40px; }
#homepage-360 .sec-review__trusted span { font-size: 13px; font-weight: 400; color: var(--c-gray60); }
#homepage-360 .sec-review__marquee { position: relative; overflow: hidden; width: 100vw; margin-left: calc(50% - 50vw); display: flex; flex-direction: column; gap: 24px; padding: 0 0 8px; box-sizing: border-box; }
#homepage-360 .sec-review__mask { position: absolute; top: 0; bottom: 0; width: 32px; z-index: 3; pointer-events: none; }
#homepage-360 .sec-review__mask--left { left: 0; background: linear-gradient(90deg, var(--c-white) 0%, rgba(var(--c-white-rgb),0.92) 35%, rgba(var(--c-white-rgb),0) 100%); }
#homepage-360 .sec-review__mask--right { right: 0; background: linear-gradient(270deg, var(--c-white) 0%, rgba(var(--c-white-rgb),0.92) 35%, rgba(var(--c-white-rgb),0) 100%); }
#homepage-360 .sec-review__row { overflow: hidden; }
#homepage-360 .sec-review__track { --review-offset: 0px; width: max-content; display: flex; align-items: stretch; gap: 24px; will-change: transform; animation-timing-function: linear; animation-iteration-count: infinite; animation-play-state: running; }
#homepage-360 .sec-review__row--1 .sec-review__track { --review-offset: -116px; animation-name: sec-review-marquee-left; animation-duration: 34s; }
#homepage-360 .sec-review__row--2 .sec-review__track { --review-offset: 92px; animation-name: sec-review-marquee-right; animation-duration: 38s; }
#homepage-360 .sec-review__group { display: flex; align-items: stretch; gap: 24px; flex-shrink: 0; }
#homepage-360 .sec-review__card { width: 436px; min-width: 600px; max-width: 600px; min-height: 140px; padding: 24px; border-radius: var(--radius-card); border: 1px solid var(--c-bg-soft-border); display: flex; flex-direction: column; transition: transform 0.3s; background: var(--c-white); flex-shrink: 0; }
#homepage-360 .sec-review__card-header { display: flex; align-items: center; gap: 12px; }
#homepage-360 .sec-review__avatar { width: 48px; height: 48px; border-radius: 100px; background: #F0F0F0; border: 1px solid var(--c-gray16); overflow: hidden; flex-shrink: 0; }
#homepage-360 .sec-review__avatar img { width: 100%; height: 100%; object-fit: cover; }
#homepage-360 .sec-review__card-info { display: flex; flex-direction: column; }
#homepage-360 .sec-review__card-role { font-size: 18px; font-weight: var(--fw-bold); line-height: 26px; }
#homepage-360 .sec-review__card-name { font-size: 14px; font-weight: 400; line-height: 20px; color: var(--c-gray60); }
#homepage-360 .sec-review__card-text { font-size: 14px; font-weight: 400; line-height: 20px; min-height: 60px; }
#homepage-360 .sec-review__stars { font-size: 16px; color: var(--c-star); letter-spacing: 2px; }

@keyframes sec-review-marquee-left { from { transform: translate3d(var(--review-offset), 0, 0); } to { transform: translate3d(calc(-50% - 12px + var(--review-offset)), 0, 0); } }
@keyframes sec-review-marquee-right { from { transform: translate3d(calc(-50% - 12px + var(--review-offset)), 0, 0); } to { transform: translate3d(var(--review-offset), 0, 0); } }

/* ===========================================
   CONTACT FORM (dark bg)
   =========================================== */
#homepage-360 .sec-contact { padding: 120px 15px; background: #F4F4F5; }
#homepage-360 .sec-contact__container { max-width: 1224px; margin: 0 auto; padding: 24px 24px 24px 72px; display: flex; gap: 72px; align-items: stretch; background: var(--c-dark); border-radius: 30px; }
#homepage-360 .sec-contact__left { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 16px; min-width: 0; padding: 24px 0; }
#homepage-360 .sec-contact__title h2 { font-size: 40px; font-weight: var(--fw-extrabold); line-height: 48px; color: var(--c-white); margin: 0; }
#homepage-360 .sec-contact__title p { margin-top: 10px; font-size: 14px; font-weight: 400; line-height: 22px; color: rgba(var(--c-white-rgb),0.60); }
#homepage-360 .sec-contact__form { display: flex; flex-direction: column; gap: 20px; }
#homepage-360 .sec-contact__row { display: flex; gap: 16px; }
#homepage-360 .sec-contact__field { flex: 1; display: flex; flex-direction: column; gap: 7px; min-width: 0; }
#homepage-360 .sec-contact__field--full { width: 100%; }
#homepage-360 .sec-contact__field label { font-size: 15px; font-weight: 600; line-height: 24px; color: var(--c-white); }
#homepage-360 .sec-contact__field input, #homepage-360 .sec-contact__field select, #homepage-360 .sec-contact__field textarea { width: 100%; padding: 12px 16px; background: var(--c-bg-input); border-radius: 12px; border: 1px solid var(--c-border-white-08); color: var(--c-white); font-family: var(--font); font-size: 14px; line-height: 20px; outline: none; transition: border-color 0.3s; }
#homepage-360 .sec-contact__field input::placeholder, #homepage-360 .sec-contact__field textarea::placeholder { color: rgba(var(--c-white-rgb),0.30); }
#homepage-360 .sec-contact__field input:focus, #homepage-360 .sec-contact__field select:focus, #homepage-360 .sec-contact__field textarea:focus { border-color: var(--c-green); }
#homepage-360 .sec-contact__field textarea { min-height: 72px; resize: vertical; }
#homepage-360 .sec-contact__field select { appearance: none; cursor: pointer; }
#homepage-360 .sec-contact__cta { display: flex; align-items: center; gap: 32px; flex-wrap: nowrap; }
#homepage-360 .sec-contact__submit { min-width: 134px; padding: 11px 28px; background: var(--c-green); border-radius: 100px; border: none; display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-family: var(--font); font-size: 16px; line-height: 24px; font-weight: var(--fw-extrabold); color: var(--c-dark); cursor: pointer; transition: background 0.3s; flex-shrink: 0; }
#homepage-360 .sec-contact__submit:hover { background: var(--c-green-hover); }
#homepage-360 .sec-contact__privacy { font-size: 12px; font-weight: 400; line-height: 16px; color: rgba(var(--c-white-rgb),0.60); }
#homepage-360 .sec-contact__privacy a { color: rgba(var(--c-white-rgb),0.60); text-decoration: underline; }
#homepage-360 .sec-contact__notice { padding: 14px 16px; border-radius: 14px; font-size: 14px; line-height: 1.5; }
#homepage-360 .sec-contact__notice--success { background: rgba(171,244,0,0.14); color: #E8FFC0; border: 1px solid rgba(171,244,0,0.24); }
#homepage-360 .sec-contact__notice--error { background: rgba(255,101,5,0.12); color: #FFE1D0; border: 1px solid rgba(255,101,5,0.22); }
#homepage-360 .sec-contact__right { flex: 0 0 420px; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; position: relative; padding: 48px 28px 22px; background: var(--c-bg-input); border: 1px solid var(--c-border-white-08); border-radius: 16px; }
#homepage-360 .sec-contact__divider { display: none; }
#homepage-360 .sec-contact__steps { display: flex; flex-direction: column; gap: 30px; position: relative; }
#homepage-360 .sec-contact__steps h3 { margin-bottom: 8px; font-size: 28px; font-weight: var(--fw-bold); line-height: 30px; color: var(--c-white); }
#homepage-360 .sec-contact__step { display: flex; gap: 16px; align-items: flex-start; position: relative; }
#homepage-360 .sec-contact__step:not(:last-child)::after { content: ""; position: absolute; left: 16px; top: 16px; width: 1px; height: calc(100% + 30px); background: rgba(var(--c-white-rgb),0.55); }
#homepage-360 .sec-contact__step-num { width: 32px; height: 32px; background: var(--c-white); border-radius: 100px; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: var(--fw-extrabold); color: var(--c-dark); flex-shrink: 0; position: relative; z-index: 1; }
#homepage-360 .sec-contact__step p { font-size: 15px; font-weight: 400; line-height: 24px; color: var(--c-white); margin: 4px 0; }
#homepage-360 .sec-contact__phone-btn { width: 100%; padding: 11px 20px; background: var(--c-white); border-radius: 100px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-size: 16px; line-height: 24px; font-weight: var(--fw-extrabold); color: var(--c-dark); text-decoration: none; align-self: flex-start; transition: background 0.3s; }
#homepage-360 .sec-contact__phone-btn:hover { background: var(--c-bg-soft-border); }

/* --- Phần Responsive và About Template giữ nguyên code cấu trúc, chỉ thay mã màu --- */
@media (max-width: 991px) {
  #homepage-360 .sec-hero { padding-top: 20px; }
  #homepage-360 .sec-hero__gradient { top: -42px; height: 220px; width: min(100%, 920px); }
  #homepage-360 .sec-hero__ellipse--yellow { right: -20px; }
  #homepage-360 .sec-hero__ellipse--blue { left: -10px; }
  #homepage-360 .sec-offer__grid { grid-template-columns: 1fr; }
  #homepage-360 .sec-slider .swiper-slide { width: min(62vw, 520px); }
  #homepage-360 .sec-slider__card { height: 260px; }
  #homepage-360 .sec-slider__body { grid-template-columns: minmax(0, 1fr) minmax(130px, 0.8fr); }
  #homepage-360 .sec-slider__visual { height: 180px; }
  #homepage-360 .sec-slider__shape--one { width: 112px; height: 138px; }
  #homepage-360 .sec-highlight__container, #homepage-360 .sec-tech__container { flex-direction: column; }
  #homepage-360 .sec-tech__left { position: static; flex: 0 0 auto; width: 100%; }
  #homepage-360 .sec-tech__grid { width: 100%; flex: 1 1 auto; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #homepage-360 .sec-blogs__slider { overflow: hidden; }
  #homepage-360 .sec-why__grid, #homepage-360 .sec-industry__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #homepage-360 .sec-industry__container { grid-template-columns: 1fr; gap: 28px; }
  #homepage-360 .sec-portfolio__item, #homepage-360 .sec-portfolio__item--reverse, #homepage-360 .sec-contact__container { flex-direction: column; }
  #homepage-360 .sec-why-visual__layout { grid-template-columns: 1fr; }
  #homepage-360 .sec-why-visual__photo { min-height: 320px; }
  #homepage-360 .sec-why-visual__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #homepage-360 .sec-why-visual__rating { width: 100%; max-width: 320px; }
  #homepage-360 .sec-expertise__container { grid-template-columns: 1fr; }
  #homepage-360 .sec-expertise__visual { max-width: 560px; }
  #homepage-360 .sec-services-review__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #homepage-360 .sec-services-stack__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #homepage-360 .sec-services-work__grid { grid-template-columns: 1fr; }
  #homepage-360 .sec-contact__container { max-width: 720px; padding: 32px; gap: 28px; }
  #homepage-360 .portfolio-page__topbar { align-items: flex-start; }
  #homepage-360 .sec-portfolio__item-cover, #homepage-360 .sec-contact__right { flex: 0 0 auto; width: 100%; }
  #homepage-360 .sec-contact__right { padding: 32px 28px 24px; }
  #homepage-360 .sec-contact__divider { display: none; }
  #homepage-360 .portfolio-page__grid { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  #homepage-360 .sec-hero { width: calc(100% - 30px); padding: 16px 0 24px; }
  #homepage-360 > section > [class$="__container"] { width: calc(100% - 30px); }
  #homepage-360 .sec-hero__titles { gap: 16px; }
  #homepage-360 .sec-hero__gradient { top: -16px; height: 170px; width: calc(100% - 24px); }
  #homepage-360 .sec-hero__ellipse { width: 240px; filter: blur(56px); opacity: 0.78; }
  #homepage-360 .sec-hero__ellipse--yellow { height: 72px; right: -20px; }
  #homepage-360 .sec-hero__ellipse--red { height: 120px; top: 0; }
  #homepage-360 .sec-hero__ellipse--blue { height: 86px; left: -12px; }
  #homepage-360 .sec-hero__desc br { display: none; }
  #homepage-360 .sec-slider { padding: 28px 0 52px; }
  #homepage-360 .sec-slider .swiper-slide { width: 86vw; opacity: 1; }
  #homepage-360 .sec-slider .swiper-slide .sec-slider__card, #homepage-360 .sec-slider .swiper-slide-prev .sec-slider__card, #homepage-360 .sec-slider .swiper-slide-next .sec-slider__card, #homepage-360 .sec-slider .swiper-slide-duplicate-prev .sec-slider__card, #homepage-360 .sec-slider .swiper-slide-duplicate-next .sec-slider__card { transform: none; filter: none; }
  #homepage-360 .sec-slider__card { height: 250px; border-radius: 18px; }
  #homepage-360 .sec-slider__mockup { padding: 16px; }
  #homepage-360 .sec-slider__body { min-height: 158px; grid-template-columns: minmax(0, 1fr) 116px; gap: 8px; }
  #homepage-360 .sec-slider__copy { gap: 10px; }
  #homepage-360 .sec-slider__copy h3 { max-width: 230px; font-size: 28px; line-height: 1; }
  #homepage-360 .sec-slider__copy a { padding: 9px 13px; }
  #homepage-360 .sec-slider__visual { height: 148px; }
  #homepage-360 .sec-slider__shape--one { width: 92px; height: 116px; }
  #homepage-360 .sec-slider__shape--two { width: 54px; height: 70px; left: 4px; }
  #homepage-360 .sec-slider__shape--three { width: 30px; height: 30px; right: 4px; }
  #homepage-360 .sec-offer { padding: 40px 16px; }
  #homepage-360 .sec-cta { padding: 40px 16px; }
  #homepage-360 .sec-cta__container { padding: 40px 20px; border-radius: 28px; }
  #homepage-360 .sec-cta__heading { font-size: 34px; line-height: 1.12; }
  #homepage-360 .sec-cta__bg-text { font-size: 88px; top: 82%; }
  #homepage-360 .sec-offer__heading { font-size: 38px; line-height: 1.1; margin-bottom: 24px; }
  #homepage-360 .sec-offer__grid { gap: 16px; }
  #homepage-360 .sec-offer__card { --offer-notch-x: 98px; --offer-notch-r: 30px; min-height: 0; padding: 22px;  border-radius: 32px; gap: 16px; }
  #homepage-360 .sec-offer__card-arrow { width: 80px; height: 60px; top: 0; right: 0; border-radius: 20px; box-shadow: 0 0 0 6px var(--c-white); }
  #homepage-360 .sec-offer__card-arrow svg { width: 28px; height: 28px; }
  #homepage-360 .sec-offer__card-title { font-size: 22px; }
  #homepage-360 .sec-offer__card-desc { max-width: 100%; font-size: 15px; line-height: 1.65; }
  #homepage-360 .sec-highlight { padding: 0 16px; }
  #homepage-360 .sec-highlight__container { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  #homepage-360 .sec-highlight__item { padding: 28px 16px; }
  #homepage-360 .sec-highlight__number { font-size: 34px; line-height: 1.1; }
  #homepage-360 .sec-highlight__label { font-size: 15px; line-height: 1.5; }
  #homepage-360 .sec-tech, #homepage-360 .sec-blogs { padding: 0 16px; }
  #homepage-360 .sec-tech__heading, #homepage-360 .sec-blogs__heading { font-size: 38px; line-height: 1.1; }
  #homepage-360 .sec-tech__desc { font-size: 16px; line-height: 1.6; }
  #homepage-360 .sec-tech__grid { height: 430px; width: 100%; padding: 0; border-radius: 0; grid-template-columns: repeat(3, minmax(100px, 1fr)); gap: 10px; }
  #homepage-360 .sec-tech__mask { height: 48px; }
  #homepage-360 .sec-tech__column { height: 430px; border-left: 1px solid var(--c-gray16); border-right: 1px solid var(--c-gray16); }
  #homepage-360 .sec-tech__item { padding: 12px; border-radius: 16px; gap: 10px; }
  #homepage-360 .sec-tech__item-icon { width: 38px; height: 38px; border-radius: 12px; }
  #homepage-360 .sec-tech__item-icon::before { font-size: 28px; }
  #homepage-360 .sec-tech__item-name { font-size: 13px; line-height: 1.4; }
  #homepage-360 .sec-tech__item-cat { font-size: 11px; line-height: 1.3; }
  #homepage-360 .sec-blogs__heading { margin-bottom: 28px; }
  #homepage-360 .sec-blogs__controls { margin-top: 26px; }
  #homepage-360 .sec-blogs__arrow { width: 44px; height: 44px; }
  #homepage-360 .sec-blogs__item-title { font-size: 18px; line-height: 1.4; }
  #homepage-360 .sec-blogs__item-desc { min-height: 0; }
  #homepage-360.about-360 .sec-offer{padding: 40px 15px;}
}

@media (max-width: 520px) {
  #homepage-360 .sec-hero__breakthrough { font-size: 44px; letter-spacing: -0.04em; }
  #homepage-360 .sec-hero__creative { font-size: 52px; letter-spacing: -0.04em; }
  #homepage-360 .sec-slider .swiper-slide { width: 90vw; }
  #homepage-360 .sec-slider__card { height: 232px; }
  #homepage-360 .sec-slider__topbar { font-size: 8px; }
  #homepage-360 .sec-slider__body { grid-template-columns: minmax(0, 1fr) 88px; }
  #homepage-360 .sec-slider__copy h3 { font-size: 23px; }
  #homepage-360 .sec-slider__meta { max-width: 210px; font-size: 9px; }
  #homepage-360 .sec-slider__visual { height: 124px; }
  #homepage-360 .sec-slider__shape--one { width: 74px; height: 98px; }
  #homepage-360 .sec-highlight__container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #homepage-360 .sec-tech__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); height: 420px; }
  #homepage-360 .sec-tech__column { height: 420px; }
  #homepage-360 .sec-tech__column--3 { display: none; }
  #homepage-360 .sec-why, #homepage-360 .sec-industry, #homepage-360 .sec-portfolio, #homepage-360 .sec-why-visual, #homepage-360 .sec-review, #homepage-360 .sec-contact { padding-left: 14px; padding-right: 14px; }
  #homepage-360 .sec-industry__item { gap: 12px; }
  #homepage-360 .sec-industry__item-icon { width: 56px; height: 56px; border-radius: 16px; }
  #homepage-360 .sec-industry__item span { font-size: 15px; }
  #homepage-360 .sec-portfolio__item-cover { min-height: 190px; }
  #homepage-360 .sec-why-visual { padding-top: 72px; padding-bottom: 24px; }
  #homepage-360 .sec-why-visual__heading { margin-bottom: 28px; font-size: 36px; }
  #homepage-360 .sec-why-visual__stats { grid-template-columns: 1fr; }
  #homepage-360 .sec-why-visual__ring { --size: 112px; }
  #homepage-360 .sec-why-visual__rating { width: 100%; padding: 20px; }
  #homepage-360 .sec-services-cta { padding-top: 8px; padding-bottom: 42px; }
  #homepage-360 .sec-services-cta__panel { padding: 36px 18px 28px; border-radius: 22px; }
  #homepage-360 .sec-services-cta__title, #homepage-360 .sec-expertise__heading { font-size: 36px; }
  #homepage-360 .sec-services-cta__title { margin-bottom: 22px; }
  #homepage-360 .sec-expertise { padding-bottom: 56px; }
  #homepage-360 .sec-expertise__grid { grid-template-columns: 1fr; gap: 10px; }
  #homepage-360 .sec-expertise__item { min-height: 54px; padding-right: 14px; }
  #homepage-360 .sec-expertise__visual-frame { min-height: 280px; padding: 20px; }
  #homepage-360 .sec-expertise__visual-band { height: 146px; border-radius: 24px; }
  #homepage-360 .sec-expertise__visual-frame img { width: min(100%, 190px); }
  #homepage-360 .sec-services-review__heading, #homepage-360 .sec-services-stack__heading { font-size: 36px; }
  #homepage-360 .sec-services-review__grid, #homepage-360 .sec-services-stack__grid { grid-template-columns: 1fr; }
  #homepage-360 .sec-services-review__card { min-height: auto; }
  #homepage-360 .sec-services-stack { padding-top: 56px; padding-bottom: 64px; }
  #homepage-360 .sec-services-work { padding: 40px 15px; }
  #homepage-360 .sec-services-work__heading { font-size: 36px; margin-bottom: 28px; }
  #homepage-360 .sec-services-work__intro h3 { font-size: 24px; }
  body.page-template-page_services #homepage-360 .sec-contact { padding: 40px 15px; }
  body.page-template-page_services #homepage-360 .sec-contact__container, body.page-template-page_services #homepage-360 .sec-contact__left, body.page-template-page_services #homepage-360 .sec-contact__right { padding: 18px; }
  #homepage-360 .portfolio-page__hero { padding: 24px 0 28px; }
  #homepage-360 .portfolio-page__breadcrumb { margin-bottom: 22px; }
  #homepage-360 .portfolio-page__topbar { flex-direction: column; align-items: flex-start; }
  #homepage-360 .portfolio-page__title { font-size: 44px; }
  #homepage-360 .portfolio-page__grid-wrap { padding-bottom: 72px; }
  #homepage-360 .portfolio-page__grid { grid-template-columns: 1fr; gap: 40px; }
  #homepage-360 .portfolio-page__media { min-height: 250px; }
  #homepage-360 .sec-review__card { width: 86vw; max-width: 86vw; padding: 18px; }
  #homepage-360 .sec-review__card-role { font-size: 16px; line-height: 1.35; }
  #homepage-360 .sec-contact__container { padding: 22px 14px; }
  #homepage-360 .sec-contact__right { padding: 24px 18px; }
}

#homepage-360.about-360 .about-360__tech { background: var(--c-bg-dark-section); }
#homepage-360.about-360 .about-360__tech .sec-tech__heading, #homepage-360.about-360 .about-360__tech .sec-tech__item-name { color: var(--c-white); }
#homepage-360.about-360 .about-360__tech .sec-tech__desc, #homepage-360.about-360 .about-360__tech .sec-tech__item-cat { color: var(--c-text-white-62); }
#homepage-360.about-360 .about-360__tech .sec-tech__grid, #homepage-360.about-360 .about-360__tech .sec-tech__item { background: var(--c-bg-dark-section); border-color: var(--c-border-white-10); }
#homepage-360.about-360 .about-360__tech .sec-tech__item { background: #181818; }
#homepage-360.about-360 .about-360__tech .sec-tech__mask--left { background: linear-gradient(180deg, var(--c-bg-dark-section) 0%, rgba(17,17,17,0) 100%); }
#homepage-360.about-360 .about-360__tech .sec-tech__mask--right { background: linear-gradient(0deg, var(--c-bg-dark-section) 0%, rgba(17,17,17,0) 100%); }

@media (max-width: 991px) {
  .about-360__story, .about-360__team { padding: 80px 0; }
  .about-360__story-grid { grid-template-columns: 1fr; }
  .about-360__team-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .about-360__breadcrumb { padding: 20px 0; }
  .about-360__story, .about-360__team { padding: 40px 0; }
  .about-360__story-copy h2 { font-size: 38px; line-height: 1.1; }
  .about-360__story-media, .about-360__story-media img { min-height: 320px; }
  .about-360__stat-grid { grid-template-columns: 1fr; }
  .about-360__team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  #homepage-360 .sec-why, #homepage-360 .sec-industry, #homepage-360 .sec-portfolio, #homepage-360 .sec-review, #homepage-360 .sec-contact { padding: 40px 15px; }
  #homepage-360 .sec-contact__container { padding: 24px 18px; border-radius: 22px; }
  #homepage-360 .sec-why__heading, #homepage-360 .sec-industry__heading, #homepage-360 .sec-portfolio__heading, #homepage-360 .sec-review__heading, #homepage-360 .sec-contact__title h2 { font-size: 38px; line-height: 1.1; }
  #homepage-360 .sec-contact__title h2 { font-size: 30px; line-height: 1.15; }
  #homepage-360 .sec-why__grid, #homepage-360 .sec-industry__grid { grid-template-columns: 1fr; gap: 16px; }
  #homepage-360 .sec-why__item, #homepage-360 .sec-review__card { padding: 22px; }
  #homepage-360 .sec-review__marquee { gap: 16px; }
  #homepage-360 .sec-review__mask { width: 24px; }
  #homepage-360 .sec-review__track, #homepage-360 .sec-review__group { gap: 16px; }
  #homepage-360 .sec-review__card { width: min(82vw, 320px); max-width: min(82vw, 320px); min-height: 0; }
  #homepage-360 .sec-review__row--1 .sec-review__track, #homepage-360 .sec-review__row--2 .sec-review__track { --review-offset: 0px; }
  #homepage-360 .sec-why__item { min-height: 0; gap: 18px; }
  #homepage-360 .sec-industry__title-section { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 0; }
  #homepage-360 .sec-industry__item { min-height: 86px; padding: 12px 16px 12px 12px; }
  #homepage-360 .sec-portfolio__list { gap: 16px; }
  #homepage-360 .sec-portfolio__item, #homepage-360 .sec-portfolio__item--reverse { grid-template-columns: 1fr; gap: 16px; padding: 12px; }
  #homepage-360 .sec-portfolio__item-cover { min-height: 220px; border-radius: 10px; }
  #homepage-360 .sec-portfolio__item-title, #homepage-360 .sec-review__heading, #homepage-360 .sec-contact__steps h3 { font-size: 28px; line-height: 1.25; }
  #homepage-360 .sec-portfolio__item-info { min-height: 0; padding: 14px 10px 10px; }
  #homepage-360 .sec-review__trusted { flex-direction: column; gap: 10px; }
  #homepage-360 .sec-contact__row { flex-direction: column; }
  #homepage-360 .sec-contact__cta { align-items: flex-start; flex-direction: column; gap: 14px; }
  #homepage-360 .sec-contact__submit, #homepage-360 .sec-contact__phone-btn, #homepage-360 .sec-industry__btn, #homepage-360 .sec-portfolio__more-btn { width: 100%; justify-content: center; }
}

/* ===========================================
   ABOUT PAGE SHARED LAYOUT
   =========================================== */
.about-360__container { width: min(100% - 30px, var(--max-w)); margin: 0 auto; }
.about-360__breadcrumb { padding: 28px 0; background: var(--c-white); }
.about-360__breadcrumb .about-360__container { display: flex; align-items: center; gap: 8px; color: var(--c-gray44); font-size: 13px; line-height: 20px; }
.about-360__breadcrumb a { color: var(--c-dark); text-decoration: none; }
.about-360__tech { background: var(--c-bg-dark-section); }
.about-360__tech .sec-tech__heading, .about-360__tech .sec-tech__desc, .about-360__tech .sec-tech__item-name { color: var(--c-white); }
.about-360__tech .sec-tech__desc, .about-360__tech .sec-tech__item-cat { color: var(--c-text-white-62); }
.about-360__tech .sec-tech__grid, .about-360__tech .sec-tech__item { --tech-card-bg: #181818; --tech-card-border: var(--c-border-white-10); background: var(--c-bg-dark-section); }
.about-360__tech .sec-tech__mask--left { background: linear-gradient(180deg, var(--c-bg-dark-section) 0%, rgba(17,17,17,0) 100%); }
.about-360__tech .sec-tech__mask--right { background: linear-gradient(0deg, var(--c-bg-dark-section) 0%, rgba(17,17,17,0) 100%); }
.about-360__stats { margin-top: 34px; display: flex; flex-direction: column; gap: 24px; }
.about-360__stats h3 { margin: 0; color: var(--c-white); font-size: 34px; font-weight: var(--hp-heading-weight); line-height: 1.16; }
.about-360__stat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.about-360__stat-grid div { min-height: 108px; padding: 18px; border: 1px solid var(--c-border-white-10); border-radius: 22px; background: rgba(var(--c-white-rgb),0.06); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; }
.about-360__stat-grid strong { color: var(--c-white); font-size: 36px; font-weight: var(--hp-heading-weight); line-height: 1; }
.about-360__stat-grid span { color: var(--c-text-white-62); font-size: 15px; line-height: 1.4; }

/* ===========================================
   ABOUT – TECHNOLOGY STACK 
   =========================================== */
.about-360__techstack { padding: 80px 0; background: var(--c-bg-dark-section); }
.about-360__techstack-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 0.85fr); align-items: center; gap: 48px; }
.about-360__techstack-left { display: flex; flex-direction: column; gap: 28px; }
.about-360__techstack-heading { margin: 0; color: var(--c-white); font-size: 40px; font-weight: var(--hp-heading-weight); line-height: 1.15; letter-spacing: var(--hp-heading-tracking); }
.about-360__techstack-desc { margin: 0; color: var(--c-text-white-62); font-size: 16px; line-height: 1.7; max-width: 480px; }
.about-360__techstack-chips { display: flex; flex-wrap: wrap; gap: 12px; }
.about-360__techstack-chip { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: var(--radius-pill); background: rgba(var(--c-white-rgb),0.08); border: 1px solid rgba(var(--c-white-rgb),0.12); color: var(--c-white); font-size: 14px; font-weight: var(--fw-medium); line-height: 1; transition: background 0.25s ease, border-color 0.25s ease; }
.about-360__techstack-chip:hover { background: rgba(var(--c-white-rgb),0.14); border-color: rgba(var(--c-white-rgb),0.22); }
.about-360__techstack-chip-icon { width: 22px; height: 22px; border-radius: 6px; background: rgba(var(--c-white-rgb),0.12); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--hp-heading-weight); color: rgba(var(--c-white-rgb),0.7); flex-shrink: 0; }
.about-360__techstack-media { position: relative; width: 100%; aspect-ratio: 1 / 1; max-width: 400px; justify-self: end; border-radius: 30px 30px 30px 100px; overflow: hidden; background: var(--c-bg-dark-card-alt); }
.about-360__techstack-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.about-360__techstack .about-360__stats { margin-top: 6px; }

@media (max-width: 991px) {
  .about-360__techstack-grid { grid-template-columns: 1fr; gap: 32px; }
  .about-360__techstack-media { max-width: 320px; justify-self: center; }
}
@media (max-width: 767px) {
  .about-360__techstack { padding: 56px 0; }
  .about-360__techstack-heading { font-size: 32px; }
  .about-360__techstack-chips { gap: 8px; }
  .about-360__techstack-chip { padding: 8px 14px; font-size: 13px; }
  .about-360__techstack-media { max-width: 260px; border-radius: 22px 22px 22px 72px; }
  .about-360__techstack .about-360__stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.about-360__story, .about-360__team { padding: var(--hp-section-pad) 0; background: var(--c-white); }
.about-360__story-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 0.92fr); align-items: center; gap: 48px; }
.about-360__story-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; }
.about-360__story-copy h2, .about-360__team h2 { margin: 0; color: var(--c-dark); font-size: 56px; font-weight: var(--hp-heading-weight); line-height: 1.08; letter-spacing: var(--hp-heading-tracking); }
.about-360__story-copy p { margin: 0; color: rgba(var(--c-dark-alt-rgb),0.72); font-size: 16px; line-height: 1.7; }
.about-360__button { margin-top: 10px; padding: 13px 28px; border-radius: var(--radius-pill); background: var(--c-dark); color: var(--c-white); font-size: 16px; font-weight: var(--hp-heading-weight); line-height: 24px; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: background 0.3s ease, transform 0.25s ease; }
.about-360__button:hover { background: #2d2b30; transform: translateY(-2px); }
.about-360__button svg { width: 16px; height: 16px; transition: transform 0.3s ease; }
.about-360__button:hover svg { transform: translateX(4px); }
.about-360__story-media img { width: 100%; height: 100%; min-height: 520px; object-fit: cover; display: block; }
#homepage-360.about-360 .about-360__team , #homepage-360.about-360 .about-360__techstack { padding: 120px 0; }
.about-360__team h2 { margin-bottom: 40px; font-size: 40px; font-weight: var(--hp-heading-weight); line-height: 1.2; }
.about-360__team-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 24px; }
.about-360__team-card { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.about-360__team-cover { aspect-ratio: 0.78 / 1; border-radius: 22px; background: linear-gradient(145deg, #e8e7ea, #d5d4d8); display: flex; align-items: flex-end; justify-content: center; overflow: hidden; position: relative; }
.about-360__team-cover:not(.about-360__team-cover--has-img) { background: radial-gradient(circle at 30% 20%, rgba(171,244,0,0.28), transparent 34%), linear-gradient(145deg, var(--c-bg-dark-section), #343238); align-items: center; }
.about-360__team-cover--has-img { background: linear-gradient(180deg, #2a2a2a 0%, #111 100%); }
.about-360__team-cover--has-img img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; }
.about-360__team-cover span { color: rgba(var(--c-white-rgb),0.86); font-size: 56px; font-weight: var(--hp-heading-weight); line-height: 1; }
.about-360__team-social { position: absolute; bottom: 12px; left: 12px; display: flex; gap: 6px; z-index: 2; }
.about-360__team-social-link { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: var(--fw-bold); text-decoration: none; color: var(--c-white); transition: transform 0.25s ease, opacity 0.25s ease; }
.about-360__team-social-link:hover { transform: scale(1.12); opacity: 0.9; }
.about-360__team-social-link--in { background: #0A66C2; font-family: Georgia, serif; font-style: italic; font-weight: var(--hp-heading-weight); }
.about-360__team-social-link--x { background: var(--c-dark); font-size: 13px; }
.about-360__team-info { display: flex; flex-direction: column; gap: 2px; }
.about-360__team-card h3 { margin: 0; color: var(--c-dark); font-size: 16px; font-weight: var(--fw-bold); line-height: 1.4; }
.about-360__team-card p { margin: 0; color: var(--c-gray60); font-size: 14px; line-height: 1.4; }

#homepage-360.about-360 .about-360__team {
  padding: 72px 0 96px;
  background: var(--c-white);
}

#homepage-360.about-360 .about-360__team h2 {
  margin-bottom: 32px;
  font-size: 34px;
  line-height: 1.08;
}

#homepage-360.about-360 .about-360__team-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 22px;
}

#homepage-360.about-360 .about-360__team-card {
  gap: 16px;
}

#homepage-360.about-360 .about-360__team-cover {
  aspect-ratio: 0.76 / 1;
  border-radius: 14px 14px 36px 14px;
  clip-path: polygon(22% 0, 100% 0, 100% 78%, 78% 100%, 0 100%, 0 22%);
  background: #f1f1f1;
}

#homepage-360.about-360 .about-360__team-cover:not(.about-360__team-cover--has-img) {
  background: #f1f1f1;
}

#homepage-360.about-360 .about-360__team-cover--has-img img {
  object-fit: cover;
}

#homepage-360.about-360 .about-360__team-cover span {
  display: none;
}

#homepage-360.about-360 .about-360__team-social {
  bottom: 14px;
  left: 14px;
}

#homepage-360.about-360 .about-360__team-social-link {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  background: rgba(25, 23, 28, 0.72);
  backdrop-filter: blur(8px);
}

#homepage-360.about-360 .about-360__team-info {
  gap: 6px;
}

#homepage-360.about-360 .about-360__team-card h3 {
  font-size: 13px;
  line-height: 1.25;
}

#homepage-360.about-360 .about-360__team-card p {
  font-size: 12px;
  line-height: 1.3;
}

#homepage-360.about-360 .about-360__techstack {
  padding: 96px 0;
  background: var(--c-bg-dark-section);
}

#homepage-360.about-360 .about-360__techstack-grid {
  grid-template-columns: minmax(0, 0.95fr) minmax(320px, 0.86fr);
  gap: 84px;
}

#homepage-360.about-360 .about-360__techstack-heading {
  font-size: 34px;
  line-height: 1.1;
}

#homepage-360.about-360 .about-360__techstack-desc {
  display: none;
}

#homepage-360.about-360 .about-360__techstack-chips {
  max-width: 510px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

#homepage-360.about-360 .about-360__techstack-chip {
  min-height: 72px;
  padding: 0 18px;
  border-radius: 16px;
  background: rgba(var(--c-white-rgb), 0.05);
  color: rgba(var(--c-white-rgb), 0.56);
  font-size: 26px;
  gap: 10px;
}

#homepage-360.about-360 .about-360__techstack-chip-icon {
  width: auto;
  height: auto;
  border-radius: 0;
  background: transparent;
  color: rgba(var(--c-white-rgb), 0.72);
  font-size: 26px;
  line-height: 1;
}

#homepage-360.about-360 .about-360__techstack .about-360__stats {
  margin-top: 36px;
  gap: 26px;
}

#homepage-360.about-360 .about-360__stats h3 {
  font-size: 34px;
}

#homepage-360.about-360 .about-360__stat-grid {
  max-width: 510px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

#homepage-360.about-360 .about-360__stat-grid div {
  min-height: 86px;
  border-radius: 16px;
  background: rgba(var(--c-white-rgb), 0.05);
}

#homepage-360.about-360 .about-360__stat-grid strong {
  font-size: 34px;
}

#homepage-360.about-360 .about-360__techstack-media {
  max-width: 430px;
  aspect-ratio: 0.95 / 1;
  border-radius: 28px 28px 100px 28px;
  clip-path: polygon(32% 0, 100% 0, 100% 74%, 68% 100%, 0 100%, 0 32%);
  background: #2a2a2a;
}

@media (max-width: 991px) {
  #homepage-360.about-360 .about-360__team {
    padding: 64px 0 80px;
  }

  #homepage-360.about-360 .about-360__team-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #homepage-360.about-360 .about-360__techstack-grid {
    grid-template-columns: 1fr;
    gap: 48px;
  }

  #homepage-360.about-360 .about-360__techstack-media {
    justify-self: start;
  }
}

@media (max-width: 767px) {
  #homepage-360.about-360 .about-360__team {
    padding: 48px 0 64px;
  }

  #homepage-360.about-360 .about-360__team h2,
  #homepage-360.about-360 .about-360__techstack-heading,
  #homepage-360.about-360 .about-360__stats h3 {
    font-size: 30px;
  }

  #homepage-360.about-360 .about-360__team-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }

  #homepage-360.about-360 .about-360__techstack {
    padding: 64px 0;
  }

  #homepage-360.about-360 .about-360__techstack-chips,
  #homepage-360.about-360 .about-360__stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #homepage-360.about-360 .about-360__techstack-chip {
    min-height: 60px;
    font-size: 20px;
  }

  #homepage-360.about-360 .about-360__techstack-chip-icon {
    font-size: 20px;
  }
}

@media (max-width: 520px) {
  .about-360__team-grid { grid-template-columns: 1fr; }
  .about-360__team-cover { aspect-ratio: 1.2 / 1; }

  #homepage-360.about-360 .about-360__team-grid,
  #homepage-360.about-360 .about-360__techstack-chips,
  #homepage-360.about-360 .about-360__stat-grid {
    grid-template-columns: 1fr;
  }

  #homepage-360.about-360 .about-360__team-cover {
    aspect-ratio: 0.95 / 1;
  }

  #homepage-360.about-360 .about-360__techstack-media {
    max-width: 100%;
  }
}

/* Services page responsive hardening (tablet/mobile only) */
body.page-template-page_services #homepage-360 {
  --services-space-x: clamp(14px, 4vw, 24px);
}

body.page-template-page_services #homepage-360 .sec-offer__card-title,
body.page-template-page_services #homepage-360 .sec-portfolio__item-title,
body.page-template-page_services #homepage-360 .sec-services-work__intro h3,
body.page-template-page_services #homepage-360 .sec-services-stack__heading,
body.page-template-page_services #homepage-360 .sec-services-work__heading,
body.page-template-page_services #homepage-360 .sec-expertise__heading,
body.page-template-page_services #homepage-360 .about-360__story-copy h2 {
  overflow-wrap: anywhere;
}

body.page-template-page_services #homepage-360 .about-360__story-media {
  aspect-ratio: 4 / 3;
  min-height: 0;
}

body.page-template-page_services #homepage-360 .about-360__story-media img {
  min-height: 0;
}

body.page-template-page_services #homepage-360 .sec-portfolio__item-cover,
body.page-template-page_services #homepage-360 .sec-why-visual__photo {
  aspect-ratio: 16 / 10;
  min-height: 0;
}

@media (max-width: 991px) {
  body.page-template-page_services #homepage-360 .about-360__story {
    padding: 72px 0;
  }

  body.page-template-page_services #homepage-360 .about-360__story-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  body.page-template-page_services #homepage-360 .about-360__story-copy {
    width: 100%;
    max-width: 680px;
  }

  body.page-template-page_services #homepage-360 .about-360__container,
  body.page-template-page_services #homepage-360 .sec-offer,
  body.page-template-page_services #homepage-360 .sec-portfolio,
  body.page-template-page_services #homepage-360 .sec-why-visual,
  body.page-template-page_services #homepage-360 .sec-services-cta,
  body.page-template-page_services #homepage-360 .sec-expertise,
  body.page-template-page_services #homepage-360 .sec-services-stack,
  body.page-template-page_services #homepage-360 .sec-services-work,
  body.page-template-page_services #homepage-360 .sec-contact {
    padding-left: var(--services-space-x);
    padding-right: var(--services-space-x);
  }

  body.page-template-page_services #homepage-360 .about-360__story-copy h2,
  body.page-template-page_services #homepage-360 .sec-portfolio__heading,
  body.page-template-page_services #homepage-360 .sec-services-cta__title,
  body.page-template-page_services #homepage-360 .sec-expertise__heading,
  body.page-template-page_services #homepage-360 .sec-services-stack__heading,
  body.page-template-page_services #homepage-360 .sec-services-work__heading {
    font-size: clamp(34px, 6vw, 48px);
    line-height: 1.08;
  }

  body.page-template-page_services #homepage-360 .sec-services-stack__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  body.page-template-page_services #homepage-360 .about-360__breadcrumb {
    padding: 18px 0;
  }

  body.page-template-page_services #homepage-360 .about-360__story {
    padding: 36px 0 48px;
  }

  body.page-template-page_services #homepage-360 .about-360__story-grid {
    gap: 24px;
  }

  body.page-template-page_services #homepage-360 .about-360__story-copy {
    gap: 16px;
  }

  body.page-template-page_services #homepage-360 .about-360__story-copy h2 {
    font-size: 38px;
    line-height: 1.1;
  }

  body.page-template-page_services #homepage-360 .about-360__story-copy p {
    font-size: 15px;
    line-height: 1.65;
  }

  body.page-template-page_services #homepage-360 .about-360__story-media {
    width: 100%;
    border-radius: 24px;
  }

  body.page-template-page_services #homepage-360 .about-360__button,
  body.page-template-page_services #homepage-360 .sec-services-cta__button,
  body.page-template-page_services #homepage-360 .sec-portfolio__more-btn {
    width: 100%;
    justify-content: center;
  }

  body.page-template-page_services #homepage-360 .sec-expertise__grid {
    grid-template-columns: 1fr;
  }

  body.page-template-page_services #homepage-360 .sec-services-stack__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  body.page-template-page_services #homepage-360 .sec-services-stack__item {
    min-height: 50px;
    padding: 10px 12px;
  }

  body.page-template-page_services #homepage-360 .sec-contact__cta {
    flex-wrap: wrap;
    gap: 14px;
  }
}

@media (max-width: 520px) {
  body.page-template-page_services #homepage-360 .about-360__container {
    width: calc(100% - 28px);
    padding-left: 0;
    padding-right: 0;
  }

  body.page-template-page_services #homepage-360 .about-360__story-copy h2 {
    font-size: 34px;
  }

  body.page-template-page_services #homepage-360 .sec-services-stack__grid {
    grid-template-columns: 1fr;
  }

  body.page-template-page_services #homepage-360 .sec-portfolio__item-cover,
  body.page-template-page_services #homepage-360 .sec-why-visual__photo {
    aspect-ratio: 3 / 2;
  }
}

/* Contact page */
#contact-page {
  background: var(--c-white);
  color: var(--c-dark-alt);
  font-family: var(--font);
}

#contact-page *,
#contact-page *::before,
#contact-page *::after {
  box-sizing: border-box;
}

#contact-page .contact-360 {
  padding: 0 15px 120px;
}

#contact-page .contact-360__container {
  max-width: var(--max-w);
  margin: 0 auto;
}

#contact-page .contact-360__breadcrumb {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 0;
  color: var(--c-text-muted-2);
  font-size: 12px;
  line-height: 18px;
}

#contact-page .contact-360__breadcrumb a {
  color: var(--c-dark-alt);
  text-decoration: none;
}

#contact-page .contact-360__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 486px);
  align-items: start;
  gap: 76px;
}

#contact-page .contact-360__left {
  min-width: 0;
}

#contact-page .contact-360__header {
  margin-bottom: 34px;
}

#contact-page .contact-360__header h1 {
  margin: 0 0 18px;
  color: var(--c-dark-alt);
  font-size: 48px;
  font-weight: var(--fw-extrabold);
  line-height: 1.08;
  letter-spacing: -0.03em;
}

#contact-page .contact-360__header p {
  max-width: 640px;
  margin: 0;
  color: rgba(var(--c-dark-alt-rgb), 0.56);
  font-size: 16px;
  line-height: 1.6;
}

#contact-page .contact-360__form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

#contact-page .contact-360__row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

#contact-page .contact-360__field {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 8px;
}

#contact-page .contact-360__field label {
  margin: 0;
  color: var(--c-dark-alt);
  font-size: 13px;
  font-weight: var(--fw-bold);
  line-height: 18px;
}

#contact-page .contact-360__field input,
#contact-page .contact-360__field select,
#contact-page .contact-360__field textarea {
  width: 100%;
  min-height: 50px;
  padding: 13px 18px;
  border: 1px solid #d9d9d9;
  border-radius: 12px;
  background: #f6f6f6;
  color: var(--c-dark-alt);
  font-family: var(--font);
  font-size: 14px;
  line-height: 20px;
  outline: none;
  transition: border-color 0.2s ease, background 0.2s ease;
}

#contact-page .contact-360__field select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, #a5a5a5 50%), linear-gradient(135deg, #a5a5a5 50%, transparent 50%);
  background-position: calc(100% - 18px) 21px, calc(100% - 13px) 21px;
  background-repeat: no-repeat;
  background-size: 5px 5px, 5px 5px;
}

#contact-page .contact-360__field textarea {
  min-height: 122px;
  resize: vertical;
}

#contact-page .contact-360__field input::placeholder,
#contact-page .contact-360__field textarea::placeholder {
  color: #b6b6b6;
}

#contact-page .contact-360__field input:focus,
#contact-page .contact-360__field select:focus,
#contact-page .contact-360__field textarea:focus {
  border-color: var(--c-dark-alt);
  background: var(--c-white);
}

#contact-page .contact-360__cta {
  display: flex;
  align-items: center;
  gap: 22px;
}

#contact-page .contact-360__submit {
  min-width: 178px;
  min-height: 52px;
  padding: 0 28px;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--c-dark-alt);
  color: var(--c-white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-family: var(--font);
  font-size: 15px;
  font-weight: var(--fw-extrabold);
  line-height: 20px;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}

#contact-page .contact-360__submit:hover {
  background: #2c2930;
  transform: translateY(-1px);
}

#contact-page .contact-360__privacy {
  margin: 0;
  color: var(--c-text-muted-2);
  font-size: 12px;
  line-height: 1.5;
}

#contact-page .contact-360__privacy a {
  color: var(--c-text-muted-4);
  text-decoration: underline;
}

#contact-page .contact-360__notice {
  margin-bottom: 22px;
  padding: 14px 16px;
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.5;
}

#contact-page .contact-360__notice--success {
  background: rgba(77, 160, 69, 0.1);
  border: 1px solid rgba(77, 160, 69, 0.24);
  color: #2f7a29;
}

#contact-page .contact-360__notice--error {
  background: rgba(255, 75, 75, 0.1);
  border: 1px solid rgba(255, 75, 75, 0.22);
  color: #b52e2e;
}

#contact-page .contact-360__panel {
  padding: 42px 38px 38px;
  border-radius: 30px;
  background: var(--c-dark-alt);
  color: var(--c-white);
}

#contact-page .contact-360__panel h2 {
  max-width: 390px;
  margin: 0 0 34px;
  color: var(--c-white);
  font-size: 25px;
  font-weight: var(--fw-extrabold);
  line-height: 1.18;
}

#contact-page .contact-360__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 36px;
}

#contact-page .contact-360__stat {
  min-height: 86px;
  padding: 16px;
  border: 1px solid rgba(var(--c-white-rgb), 0.08);
  border-radius: 12px;
  background: rgba(var(--c-white-rgb), 0.04);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-align: center;
}

#contact-page .contact-360__stat strong {
  color: var(--c-white);
  font-size: 26px;
  font-weight: var(--fw-extrabold);
  line-height: 1;
}

#contact-page .contact-360__stat span {
  color: rgba(var(--c-white-rgb), 0.56);
  font-size: 11px;
  line-height: 1.35;
}

#contact-page .contact-360__office {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

#contact-page .contact-360__office h3 {
  margin: 0 0 18px;
  color: var(--c-white);
  font-size: 18px;
  font-weight: var(--fw-extrabold);
  line-height: 1.2;
}

#contact-page .contact-360__office a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--c-white);
  font-size: 13px;
  line-height: 1.5;
  text-decoration: none;
}

#contact-page .contact-360__office a span {
  width: 18px;
  flex: 0 0 18px;
  color: rgba(var(--c-white-rgb), 0.84);
  text-align: center;
}

#contact-page .contact-360__social {
  display: flex;
  gap: 14px;
  margin-top: 34px;
}

#contact-page .contact-360__social a {
  width: 44px;
  height: 44px;
  border: 1px solid rgba(var(--c-white-rgb), 0.08);
  border-radius: 13px;
  background: rgba(var(--c-white-rgb), 0.06);
  color: var(--c-white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: var(--fw-extrabold);
  line-height: 1;
  text-decoration: none;
  transition: background 0.2s ease, transform 0.2s ease;
}

#contact-page .contact-360__social a:hover {
  background: rgba(var(--c-white-rgb), 0.12);
  transform: translateY(-1px);
}

@media (max-width: 991px) {
  #contact-page .contact-360 {
    padding: 28px 18px 80px;
  }

  #contact-page .contact-360__breadcrumb {
    margin-bottom: 42px;
  }

  #contact-page .contact-360__layout {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  #contact-page .contact-360__header h1 {
    font-size: 42px;
  }

  #contact-page .contact-360__panel {
    max-width: 640px;
  }
}

@media (max-width: 767px) {
  #contact-page .contact-360 {
    padding: 22px 14px 56px;
  }

  #contact-page .contact-360__breadcrumb {
    margin-bottom: 30px;
  }

  #contact-page .contact-360__header {
    margin-bottom: 26px;
  }

  #contact-page .contact-360__header h1 {
    font-size: 34px;
    line-height: 1.12;
  }

  #contact-page .contact-360__header p {
    font-size: 15px;
  }

  #contact-page .contact-360__row {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  #contact-page .contact-360__cta {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  #contact-page .contact-360__submit {
    width: 100%;
  }

  #contact-page .contact-360__panel {
    padding: 28px 20px;
    border-radius: 24px;
  }

  #contact-page .contact-360__panel h2 {
    font-size: 22px;
  }

  #contact-page .contact-360__stats {
    grid-template-columns: 1fr;
  }
}
