/* Homepage card system: colour distinguishes services while layout stays consistent. */
.home-page [data-tone="blue"]{--card-start:#174484;--card-end:#10264a;--card-accent:#91c7ff;--card-icon:#bedfff;--card-ink:#153d72;--step-accent:#2463b8;--step-tint:#e7f0ff;--principle-bg:#19293c;--principle-border:#314b69}
.home-page [data-tone="teal"]{--card-start:#106556;--card-end:#12392f;--card-accent:#8fe1cd;--card-icon:#b1efdf;--card-ink:#155648;--step-accent:#127d68;--step-tint:#e0f5ed;--principle-bg:#1b302b;--principle-border:#355449}
.home-page [data-tone="violet"]{--card-start:#57368a;--card-end:#2c1e48;--card-accent:#cfafff;--card-icon:#e3d0ff;--card-ink:#52357c;--step-accent:#7745b8;--step-tint:#f0e8fb;--principle-bg:#2b2339;--principle-border:#514060}
.home-page [data-tone="orange"]{--card-start:#994525;--card-end:#48291f;--card-accent:#ffc09c;--card-icon:#ffdbc1;--card-ink:#813d22;--step-accent:#b95631;--step-tint:#fff0e5;--principle-bg:#34291f;--principle-border:#5d4433}
.home-page .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.home-page .service-card{display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate;position:relative;min-width:0;min-height:550px;overflow:hidden;padding:34px;border:1px solid #ffffff24;border-radius:18px;background:#0d1116;box-shadow:inset 0 1px 0 #ffffff0a,0 10px 25px #00000012;transition:transform .25s,border-color .25s,box-shadow .25s}
.home-page .service-card::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent 25%,#0d111614 42%,#0d1116e6 67%,#0d1116 100%)}
.home-page .service-media{position:absolute;top:0;left:0;z-index:-2;width:100%;height:auto;aspect-ratio:1;object-fit:cover;mask-image:linear-gradient(#000 55%,transparent 88%);pointer-events:none;transition:transform .6s ease}
.home-page .service-copy{padding-top:245px}
.home-page .service-card:hover{transform:translateY(-4px);border-color:var(--card-accent);box-shadow:0 18px 34px #00000026}
.home-page .service-card:hover .service-media{transform:scale(1.035)}
.home-page .service-number{position:absolute;top:28px;left:28px;display:grid;place-items:center;width:38px;height:38px;border:1px solid #ffffff26;border-radius:50%;background:#0d1116b3;font-family:var(--display);font-size:12px;letter-spacing:1px;font-weight:600;color:var(--card-accent)}
.home-page .service-card h3{font-size:28px;font-weight:650;letter-spacing:-.8px;color:#fff;margin:0 0 13px;line-height:1.4}
.home-page .service-card p{font-size:16px;line-height:1.85;max-width:470px;color:#d4dce5;margin:0 0 22px}
.home-page .service-tags{display:flex;flex-wrap:wrap;gap:9px;padding-top:20px;border-top:1px solid #ffffff26;margin-top:0}
.home-page .service-tags>span{font-size:13px;font-weight:500;line-height:1.5;padding:6px 11px;color:#f0f4f7;background:#ffffff0a;border:1px solid #ffffff36;border-radius:5px;white-space:normal}
.home-page .service-tags>span>span{border:0;border-radius:0;background:none;color:inherit;font:inherit;padding:0;white-space:normal}
html[lang="th"] .home-page .service-card h3{font-size:27px;letter-spacing:0;line-height:1.55}
html[lang="th"] .home-page .service-card p{line-height:1.9}

.home-page .process-band{background:#edf1f6;color:#172335;border-block:1px solid #dce3eb}
.home-page .process .eyebrow{color:#506078}
.home-page .process .section-heading>p{color:#58677a}
.home-page .about{gap:70px}
.home-page .principles{display:grid;gap:15px;padding:0;align-content:start}
.home-page .principles article,.home-page .principles article:first-child{padding:26px;gap:18px;background:linear-gradient(110deg,var(--principle-bg),#202420);border:1px solid var(--principle-border);border-radius:12px;align-items:flex-start}
.home-page .principle-icon{display:grid;place-items:center;width:46px;height:46px;flex:0 0 46px;background:var(--card-icon);color:var(--card-ink);border:0;border-radius:11px;margin-top:2px}
.home-page .principle-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.home-page .principles h3{font-size:20px;font-weight:600;line-height:1.55;letter-spacing:-.3px;color:#f1f5ee}
.home-page .principles p{font-size:16px;line-height:1.85;margin-top:9px;color:#c0cabe;max-width:none}

@media(max-width:1100px){.home-page .service-card{padding:28px}.home-page .service-grid{gap:18px}.home-page .about{gap:35px}.home-page .principles article,.home-page .principles article:first-child{padding:22px;gap:16px}.home-page .service-card h3{font-size:26px}html[lang="th"] .home-page .service-card h3{font-size:25px}}
@media(max-width:760px){.home-page .service-grid{gap:16px}.home-page .service-card{padding:24px;min-height:520px}.home-page .service-copy{padding-top:215px}.home-page .service-number{top:22px;left:22px}.home-page .service-card h3,html[lang="th"] .home-page .service-card h3{font-size:23px}.home-page .service-tags{padding-top:18px;gap:7px}.home-page .service-tags>span{font-size:12px;padding:5px 8px}.home-page .principles{margin-top:35px}.home-page .principles article,.home-page .principles article:first-child{padding:24px}.home-page .principles h3{font-size:21px}}
@media(max-width:600px){.home-page .service-grid{grid-template-columns:1fr}.home-page .service-card{padding:28px;min-height:510px}.home-page .service-media{width:110%;max-width:none;left:-5%}.home-page .service-copy{padding-top:205px}.home-page .service-card h3,html[lang="th"] .home-page .service-card h3{font-size:26px}.home-page .service-card p{max-width:none}.home-page .service-tags>span{font-size:13px;padding:6px 10px}.home-page .principles article,.home-page .principles article:first-child{padding:22px;gap:15px}.home-page .principle-icon{width:42px;height:42px;flex-basis:42px}.home-page .principles h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){.home-page .service-card,.home-page .service-media{transition:none}.home-page .service-card:hover,.home-page .service-card:hover .service-media{transform:none}}