/* Action hierarchy shared across the portfolio. Utility controls keep their own sizing. */
:root{--action-height:56px;--action-border:#756795;--action-surface:#14101f}
:is(.glass-button,.white-button){min-height:var(--action-height);padding:13px 23px;font-size:14px;font-weight:700;line-height:1.25;letter-spacing:.005em}
:is(.glass-button,.white-button,.hero-project,.hero-cv,.hero-hiring,.service-enquiry,.contact-intents a,.all-projects,.more-websites,.portfolio-download,.game-card-play){transition:background .2s,border-color .2s,box-shadow .2s,translate .2s,color .2s}
:is(.glass-button,.white-button,.hero-project,.hero-cv,.hero-hiring,.service-enquiry,.contact-intents a,.all-projects,.more-websites,.portfolio-download):hover{translate:0 -2px}
.action-with-icon>.icon,.white-button>.icon,.glass-button>.icon{width:18px;height:18px}

/* Hero: make the project enquiry as clear and easy to tap as work exploration. */
.hero-actions{gap:12px 14px;margin-top:32px}
.hero-actions .hero-primary{min-height:60px;padding:15px 26px;border-color:#8672d1;background:linear-gradient(115deg,#3454b4,#6240a0);box-shadow:inset 0 1px 0 #ffffff70,0 9px 30px #4169e13d;font-size:15px}
.hero-actions .hero-primary:hover{background:linear-gradient(115deg,#4169e1,#7851c6);box-shadow:inset 0 1px 0 #ffffff80,0 12px 34px #7851c652}
.hero-project{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:60px;padding:14px 23px;border:1px solid #8b77b0;border-radius:999px;background:#191327;color:#fff;font-size:14px;font-weight:700;text-decoration:none;box-shadow:inset 0 1px 0 #ffffff2b,0 8px 25px #0006}
.hero-project:hover{background:#2c2050;border-color:#bca2ed;color:#fff}
.hero-cv,.hero-hiring{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 18px;border:1px solid #625574;border-radius:999px;background:#0d0a16;color:#eee9f8;font-size:13px;font-weight:700;text-decoration:none;white-space:normal}
.hero-cv:hover,.hero-hiring:hover{background:#211931;border-color:#a588ce;color:#fff}
.hero-hiring{margin-top:14px}
.hero-hiring.action-with-icon>span{text-decoration:none}

/* Browse and service actions. */
.all-projects,.more-websites{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:12px 22px;border:1px solid #715f9a;border-radius:999px;background:#171026;color:#fff;font-size:14px;font-weight:700;text-align:center}
.all-projects:hover,.more-websites:hover{background:#2b1d47;border-color:#b49be6;color:#fff}
.portfolio-download{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:10px 18px;border:1px solid #514663;border-radius:999px;color:#dcd4e8;font-size:13px;font-weight:700}
.portfolio-download:hover{border-color:#aa92d0;color:#fff}
.hiring-actions{gap:13px;margin-top:32px}
.hiring-actions .glass-button{min-height:58px;padding-inline:24px;font-size:14px}
.hiring-actions .text-link{display:inline-flex;align-items:center;gap:9px;min-height:52px;padding:11px 18px;border:1px solid #655777;border-radius:999px;background:#0d0a16;color:#f0eaf9;font-size:13px;font-weight:700;text-decoration:none}
.hiring-actions .text-link:hover{background:#211831;border-color:#b49be6;color:#fff}
.service-enquiry{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;margin-top:21px;padding:12px 18px;border:1px solid #7f6dc4;border-radius:999px;background:linear-gradient(110deg,#2e479d,#50327f);color:#fff;font-size:13px;font-weight:700;line-height:1.3;text-align:center;text-decoration:none;box-shadow:0 8px 24px #4169e123}
.service-enquiry:hover{background:linear-gradient(110deg,#4169e1,#7851c6);border-color:#ad9be4;color:#fff}
.service-proof a{min-height:44px;font-size:13px}
.offers-contact{min-height:58px;margin-block-start:38px;padding:15px 26px;border-color:#8975c4;background:linear-gradient(110deg,#304ba4,#594098);color:#fff;font-size:14px;box-shadow:0 9px 26px #4169e128}
.offers-contact:hover{background:linear-gradient(110deg,#4169e1,#7851c6);color:#fff}

/* Contact card and final contact section. */
.contact-card-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.contact-card-actions :is(.white-button,.glass-button){flex:1 1 150px;min-height:56px;padding:13px 16px;font-size:14px;white-space:normal;text-align:center}
.contact-card-actions .white-button{box-shadow:0 8px 24px #4169e14d}
.contact-card-actions .glass-button{border-color:#8875a5;background:#171123;box-shadow:inset 0 1px 0 #ffffff36}
.footer-heading .white-button{min-height:62px;padding:16px 26px;font-size:15px;box-shadow:0 12px 30px #4169e13d}
.contact-intents a{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;width:fit-content;max-width:100%;padding:12px 19px;border:1px solid #7d6b9e;border-radius:999px;background:#151021;color:#f1ebfa;font-size:14px;font-weight:700;line-height:1.35;text-decoration:none}
.contact-intents a:hover{background:#2b2041;border-color:#bfa5eb;color:#fff}
.contact-intents .action-with-icon>span{text-decoration:none}
.footer-cv{display:inline-flex;align-items:center;gap:10px;min-height:50px;padding:10px 18px;border:1px solid #5f526f;border-radius:999px;color:#e2d9ee;font-size:13px;font-weight:700;text-decoration:none}
.footer-cv:hover{background:#20162e;border-color:#a98cce;color:#fff}
.footer-columns .action-with-icon{min-height:44px;font-size:14px}
.case-project-actions{gap:13px}
.case-project-actions .glass-button{min-height:58px;padding:14px 24px;font-size:14px;border-color:#8573bd;background:linear-gradient(110deg,#304aa2,#54368b)}
.case-project-actions .text-link{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:12px 20px;border:1px solid #736381;border-radius:999px;background:#15101f;color:#f1ebfa;font-size:14px;font-weight:700;text-decoration:none}
.case-project-actions .text-link:hover{background:#2b2041;border-color:#bfa5eb;color:#fff}
.game-card-play{min-height:52px;padding:12px 16px;font-size:14px}
.main-nav .nav-contact{min-height:38px;padding:9px 15px;font-size:13px;font-weight:700}
.floating-contact{width:66px;height:66px;min-height:66px;padding:8px}
.floating-contact .mail-ring{width:48px;height:48px}

[dir=rtl] :is(.glass-button,.white-button,.hero-project,.hero-cv,.hero-hiring,.service-enquiry,.contact-intents a,.all-projects,.more-websites,.portfolio-download){font-size:16px}
[dir=rtl] .hero-actions .hero-primary{font-size:17px}
[dir=rtl] .contact-card-actions :is(.white-button,.glass-button){font-size:16px}
[dir=rtl] .footer-heading .white-button{font-size:17px}
[dir=rtl] .game-card-play{font-size:16px}

@media(max-width:650px){
  .hero-actions{display:grid;grid-template-columns:1fr;gap:11px;margin-top:28px}
  .hero-actions :is(.hero-primary,.hero-project,.hero-cv){width:100%;min-height:54px;justify-content:center;padding:12px 16px;text-align:center}
  .hero-hiring{width:100%;min-height:50px;justify-content:center;text-align:center}
  .contact-card-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .contact-card-actions :is(.white-button,.glass-button){width:100%;min-height:56px}
  .footer-heading .white-button{width:fit-content;min-height:58px;margin-top:30px}
  .contact-intents{gap:22px}
  .contact-intents a{width:100%}
  .hiring-actions{gap:11px}
  .hiring-actions :is(.glass-button,.text-link){width:100%;justify-content:center;text-align:center}
  .service-enquiry{width:100%}
  .case-project-actions a{width:100%;justify-content:center;text-align:center}
}
@media(prefers-reduced-motion:reduce){:is(.glass-button,.white-button,.hero-project,.hero-cv,.hero-hiring,.service-enquiry,.contact-intents a,.all-projects,.more-websites,.portfolio-download,.game-card-play){transition:none;translate:none!important}}