/* Shared glass finishes. Base layout and typography stay in styles.css. */
body.glass-theme {
  --glass-edge: rgba(170, 208, 250, .23);
  --glass-shadow: 0 16px 40px rgba(2, 7, 17, .24);
  --glass-fill: linear-gradient(135deg, rgba(154, 191, 234, .085), rgba(18, 36, 60, .48));
  background-color: #0b1220;
  background-image:
    radial-gradient(ellipse 950px 650px at 95% 0, rgba(52, 103, 165, .22), transparent 76%),
    radial-gradient(ellipse 800px 1000px at 4% 37%, rgba(26, 83, 133, .15), transparent 73%),
    radial-gradient(ellipse 800px 800px at 100% 72%, rgba(41, 76, 137, .16), transparent 75%);

}
.glass-theme > header {
  background: linear-gradient(180deg, rgba(45, 65, 92, .6), rgba(16, 26, 42, .72));
  border-bottom-color: var(--glass-edge);
  box-shadow: inset 0 1px rgba(216, 235, 255, .09), 0 8px 25px rgba(0, 0, 0, .12);
  -webkit-backdrop-filter: blur(20px) saturate(120%);
  backdrop-filter: blur(20px) saturate(120%);
}
.glass-theme .hero {
  background: radial-gradient(ellipse at 85% 10%, rgba(58, 118, 169, .17), transparent 70%), rgba(11, 23, 44, .74);
}
.glass-theme .hero-aside {
  background: linear-gradient(135deg, rgba(169, 211, 249, .10), rgba(18, 37, 65, .7));
  border-color: var(--glass-edge);
  box-shadow: inset 1px 0 rgba(213, 236, 255, .07);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  backdrop-filter: blur(18px) saturate(120%);
}
.glass-theme .hero-aside li { border-bottom-color: var(--glass-edge); }
.glass-theme .credentials {
  background: rgba(17, 29, 46, .55);
  border-color: var(--glass-edge);
  box-shadow: inset 0 1px rgba(193, 219, 249, .055);
}
.glass-theme .approach {
  background: linear-gradient(135deg, rgba(59, 87, 122, .23), rgba(20, 32, 52, .8));
  box-shadow: inset 0 1px rgba(168, 210, 250, .12), inset 0 -1px rgba(168, 210, 250, .07);
}
.glass-theme .steps article { border-top-color: rgba(169, 205, 250, .28); }
.glass-theme .service-grid { border-top-color: rgba(169, 205, 250, .4); }
.glass-theme .vision {
  background: linear-gradient(115deg, rgba(50, 92, 141, .48), rgba(18, 46, 83, .72));
  box-shadow: inset 0 1px rgba(184, 222, 255, .22), inset 0 -1px rgba(127, 188, 237, .13);
}
.glass-theme .brief {
  border-radius: 20px;
  background: var(--glass-fill);
  border: 1px solid var(--glass-edge);
  box-shadow: inset 0 1px rgba(227, 240, 255, .08), var(--glass-shadow);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  backdrop-filter: blur(18px) saturate(120%);
}
.glass-theme .button,
.glass-theme .nav-cta,
.glass-theme #menu {
  border-radius: 12px;
  border: 1px solid rgba(174, 214, 255, .34);
  background: linear-gradient(180deg, rgba(134, 187, 248, .16), rgba(60, 104, 159, .11)), #163356;
  color: #eaf2ff;
  box-shadow: inset 0 1px rgba(231, 244, 255, .17), 0 6px 16px rgba(0, 4, 13, .22);
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.glass-theme .button:not(.light) { background-color: #184ca8; }
.glass-theme .experience-tags span {
  border-radius: 10px;
  border-color: rgba(160, 196, 239, .2);
  background: linear-gradient(150deg, rgba(148, 195, 246, .09), rgba(16, 26, 42, .68));
  box-shadow: inset 0 1px rgba(216, 235, 255, .05);
}
.glass-theme input,
.glass-theme textarea,
.glass-theme select {
  border-radius: 10px;
  border-color: rgba(161, 196, 239, .35);
  background: rgba(9, 18, 32, .7);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, .15);
}
.glass-theme select option { background: #101a2a; color: #e2e9f3; }
.glass-theme > footer { background: rgba(11, 18, 32, .55); border-color: var(--glass-edge); }
@media(hover:hover) {
  .glass-theme .button:hover,
  .glass-theme .nav-cta:hover,
  .glass-theme #menu:hover {
    background-color: #234970;
    border-color: rgba(192, 231, 255, .65);
    box-shadow: inset 0 1px rgba(238, 250, 255, .25), 0 8px 23px rgba(0, 7, 23, .28);
  }
}
/* Glossy: stronger directional highlights, curved rims, and blue light. */
body.glass-glossy {
  --glass-edge: rgba(182, 220, 255, .34);
  --glass-shadow: 0 20px 55px rgba(0, 5, 18, .36), 0 0 28px rgba(77, 134, 200, .055);
  background-image:
    radial-gradient(ellipse 720px 950px at 95% 7%, rgba(62, 127, 178, .30), transparent 75%),
    radial-gradient(ellipse 1100px 1250px at 0 37%, rgba(43, 87, 145, .20), transparent 76%),
    radial-gradient(ellipse 700px 1100px at 92% 75%, rgba(40, 108, 160, .22), transparent 74%);
}
.glass-glossy > header {
  background: linear-gradient(175deg, rgba(172, 207, 244, .16), rgba(23, 37, 61, .72) 55%, rgba(12, 24, 42, .83));
  box-shadow: inset 0 1px rgba(226, 245, 255, .24), 0 8px 32px rgba(0, 0, 0, .22);
}
.glass-glossy .hero {
  background:
    radial-gradient(ellipse at 88% 5%, rgba(110, 190, 223, .16), transparent 61%),
    linear-gradient(128deg, rgba(11, 23, 44, .93) 30%, rgba(23, 49, 78, .75));
}
.glass-glossy .hero-aside {
  background: linear-gradient(146deg, rgba(164, 208, 250, .15), rgba(18, 37, 65, .43) 48%, rgba(76, 134, 177, .10));
  box-shadow: inset 1px 0 rgba(226, 248, 255, .13);
}
.glass-glossy .hero-aside ol { display:grid; row-gap:12px; }
.glass-glossy .hero-aside li {
  border:0;
  border-radius:20px;
  position:relative;
  isolation:isolate;
}
.glass-glossy .hero-aside li::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0 -16px;
  border-radius:inherit;
  border:1px solid rgba(178, 219, 252, .31);
  background:
    linear-gradient(116deg, rgba(232, 247, 255, .13), transparent 24%, transparent 78%, rgba(162, 222, 255, .07)),
    linear-gradient(180deg, rgba(162, 197, 232, .14), rgba(24, 42, 65, .59) 49%, rgba(10, 27, 46, .45) 51%, rgba(49, 88, 120, .24));
  box-shadow: inset 0 1px 1px rgba(236, 250, 255, .32), inset 0 -1px 1px rgba(166, 218, 250, .10), 0 7px 15px rgba(0, 7, 19, .18);
}
.glass-glossy .hero-aside li .goal-description { color:#d0dbea; }
.glass-glossy .brief {
  border-radius:26px;
  background:
    linear-gradient(130deg, rgba(207, 231, 255, .12), transparent 30%, transparent 76%, rgba(109, 188, 246, .08)),
    linear-gradient(180deg, rgba(52, 80, 118, .5), rgba(18, 34, 54, .65));
  box-shadow: inset 0 1px 1px rgba(226, 246, 255, .32), inset 0 -1px rgba(162, 210, 243, .15), var(--glass-shadow);
}
.glass-glossy .vision {
  background: linear-gradient(115deg, rgba(125, 181, 228, .16), transparent 38%), linear-gradient(160deg, rgba(41, 81, 123, .64), rgba(12, 37, 65, .83));
  box-shadow: inset 0 1px rgba(205, 240, 255, .31), inset 0 -1px rgba(135, 205, 250, .17);
}
.glass-glossy .button,
.glass-glossy .nav-cta,
.glass-glossy #menu {
  border-radius:999px;
  border-color:rgba(190, 227, 255, .47);
  background-image:linear-gradient(180deg, rgba(214, 234, 255, .23), rgba(151, 201, 244, .10) 48%, rgba(8, 21, 38, .08) 51%, rgba(135, 201, 240, .09));
  box-shadow:inset 0 1px 1px rgba(238, 251, 255, .42), inset 0 -1px rgba(188, 230, 255, .16), 0 8px 22px rgba(0, 6, 20, .3);
}
.glass-glossy .experience-tags span {
  border-radius:18px;
  border-color:rgba(174, 212, 250, .25);
  background:linear-gradient(150deg, rgba(156, 194, 237, .15), rgba(17, 36, 58, .56));
  box-shadow:inset 0 1px rgba(222, 246, 255, .17), 0 3px 8px rgba(0, 4, 13, .15);
}
/* Preview controls are exclusive to the two comparison pages. */
.design-preview {
  position:fixed;
  bottom:max(14px, env(safe-area-inset-bottom, 0px));
  left:50%;transform:translateX(-50%);
  z-index:50;
  display:flex;align-items:center;gap:5px;
  max-width:calc(100% - 24px);
  width:max-content;
  padding:6px;
  border:1px solid rgba(178, 215, 250, .38);
  border-radius:999px;
  background:rgba(15, 29, 48, .95);
  box-shadow:inset 0 1px rgba(230, 246, 255, .17), 0 8px 36px rgba(0, 0, 0, .44);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
}
.design-preview span { font-size:12px;letter-spacing:.08em;color:#b1c2d8;padding:0 10px; }
.design-preview a { font-size:14px;line-height:1.3;min-height:44px;display:flex;align-items:center;padding:9px 16px;border-radius:999px;color:#d4e2f2; }
.design-preview a[aria-current=page] { background:#294a70;color:#f4f9ff;box-shadow:inset 0 1px rgba(214, 240, 255, .2); }
.design-preview a:hover { background:#203c5c; }
@media(max-width:760px) {
  .glass-glossy .hero-aside ol { column-gap:25px; row-gap:12px; }
  .glass-glossy .hero-aside li::before { inset:0 -8px; border-radius:16px; }
  .glass-glossy .hero-aside li { padding-top:16px;padding-bottom:16px; }
  .glass-theme .brief { border-radius:18px; }
  .glass-glossy .brief { border-radius:22px; }
  .design-preview span { display:none; }
  .design-preview a { padding-left:14px; padding-right:14px; }
}
@media(prefers-reduced-motion:reduce) {
  .glass-theme .button,.glass-theme .nav-cta,.glass-theme #menu { transition:none; }
}
@media(prefers-reduced-transparency:reduce) {
  .glass-theme > header,.glass-theme .hero-aside,.glass-theme .brief,.glass-theme .approach,.design-preview {
    background:#142238;-webkit-backdrop-filter:none;backdrop-filter:none;
  }
}
@media print { .design-preview{display:none}body.glass-theme{background:white;padding-bottom:0}.glass-theme .experience-tags span{background:white;box-shadow:none} }

/* Reserve comparison controls only on the optional preview pages. */
body.design-study { padding-bottom:calc(90px + env(safe-area-inset-bottom, 0px)); }
/* White accents distinguish actionable controls from decorative glass tags. */
.glass-theme .button,
.glass-theme .nav-cta,
.glass-theme #menu {
  border-top-color:rgba(255,255,255,.72);
  border-right-color:rgba(226,243,255,.43);
  border-bottom-color:rgba(205,229,250,.29);
  border-left-color:rgba(239,249,255,.53);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.5), inset 0 -1px rgba(188,230,255,.16), 0 8px 22px rgba(0,6,20,.3);
}
.glass-theme nav a:not(.nav-cta),
.glass-theme .contact-pending a,
.glass-theme #privacy-toggle {
  text-decoration-line:underline;
  text-decoration-color:rgba(255,255,255,.56);
  text-decoration-thickness:1px;
  text-underline-offset:5px;
  text-decoration-skip-ink:auto;
}
.glass-theme .service a { border-bottom-color:rgba(255,255,255,.6); }
.glass-theme .brand .brand-small {
  text-decoration:underline;
  text-decoration-color:rgba(255,255,255,.4);
  text-decoration-thickness:1px;
  text-underline-offset:5px;
}
.glass-theme a:focus-visible,
.glass-theme button:focus-visible {
  outline:2px solid #fff;
  outline-offset:5px;
}
@media(hover:hover) {
  .glass-theme .button:hover,.glass-theme .nav-cta:hover,.glass-theme #menu:hover {
    color:#fff;
    border-color:rgba(255,255,255,.82);
    box-shadow:inset 0 1px 1px rgba(255,255,255,.6), inset 0 -1px rgba(188,230,255,.2), 0 8px 24px rgba(0,6,20,.33);
  }
  .glass-theme nav a:not(.nav-cta):hover,.glass-theme .service a:hover,
  .glass-theme .contact-pending a:hover,.glass-theme #privacy-toggle:hover { color:#fff;text-decoration-color:#fff;border-bottom-color:#fff; }
  .glass-theme .brand:hover .brand-small { text-decoration-color:#fff; }
}
.glass-theme .button:active,.glass-theme .nav-cta:active,.glass-theme #menu:active {
  box-shadow:inset 0 2px 8px rgba(0,8,23,.32), inset 0 1px rgba(255,255,255,.32);
}
@media print { body.design-study{padding-bottom:0} }

/* Rose-red payment actions stay distinct from the site's blue inquiry actions. */
.glass-theme .button.payment-button,
.glass-theme .nav-cta.payment-button {
  color:#fff;
  border-top-color:rgba(255,225,229,.9);
  border-right-color:rgba(245,166,176,.72);
  border-bottom-color:rgba(120,25,40,.72);
  border-left-color:rgba(255,205,212,.76);
  background-color:#b44755;
  background-image:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,.08) 47%,rgba(74,5,19,.18) 52%),linear-gradient(135deg,#ca5c69,#9f3544);
  box-shadow:inset 0 1px 1px rgba(255,245,247,.62),inset 0 -1px rgba(87,9,24,.28),0 8px 22px rgba(38,2,12,.34),0 0 18px rgba(214,83,101,.08);
}
@media(hover:hover) {
  .glass-theme .button.payment-button:hover,
  .glass-theme .nav-cta.payment-button:hover {
    color:#fff;
    border-color:rgba(255,222,227,.95);
    background-color:#c85a67;
    background-image:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.11) 47%,rgba(74,5,19,.14) 52%),linear-gradient(135deg,#d86d78,#ae4050);
    box-shadow:inset 0 1px 1px rgba(255,250,251,.72),inset 0 -1px rgba(87,9,24,.22),0 10px 25px rgba(45,2,14,.4),0 0 22px rgba(228,96,114,.13);
  }
}
