|
@@ -23,7 +23,28 @@ body {
|
|
|
margin: 0;
|
|
margin: 0;
|
|
|
background: var(--gc-brand-header);
|
|
background: var(--gc-brand-header);
|
|
|
border-bottom: 1px solid var(--gc-brand-border);
|
|
border-bottom: 1px solid var(--gc-brand-border);
|
|
|
- box-shadow: 0 2px 8px #1826300a;
|
|
|
|
|
|
|
+ filter: drop-shadow(0 2px 4px #1826300a);
|
|
|
|
|
+}
|
|
|
|
|
+/* Extend only the background, keeping navigation aligned with the content. */
|
|
|
|
|
+.gc-app-header.header::before {
|
|
|
|
|
+ content: "";
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ inset: 0;
|
|
|
|
|
+ z-index: -1;
|
|
|
|
|
+ background: var(--gc-brand-header);
|
|
|
|
|
+ box-shadow: 0 0 0 100vmax var(--gc-brand-header);
|
|
|
|
|
+ clip-path: inset(0 -100vmax);
|
|
|
|
|
+ pointer-events: none;
|
|
|
|
|
+}
|
|
|
|
|
+.gc-app-header.header::after {
|
|
|
|
|
+ content: "";
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ inset: auto 0 -1px;
|
|
|
|
|
+ height: 1px;
|
|
|
|
|
+ background: var(--gc-brand-border);
|
|
|
|
|
+ box-shadow: 0 0 0 100vmax var(--gc-brand-border);
|
|
|
|
|
+ clip-path: inset(0 -100vmax);
|
|
|
|
|
+ pointer-events: none;
|
|
|
}
|
|
}
|
|
|
.gc-app-header .gc-header-inner {
|
|
.gc-app-header .gc-header-inner {
|
|
|
display: flex;
|
|
display: flex;
|