*{
box-sizing:border-box;
}
html{
scroll-behavior:smooth;
}
body{
margin:0;
background:#f4f2ee;
color:#111;
font-family:
Inter,
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
sans-serif;
-webkit-font-smoothing:antialiased;
}
a{
color:inherit;
text-decoration:none;
}
.site-header{
position:absolute;
z-index:20;
top:0;
left:0;
width:100%;
padding:30px 5.8vw;
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
color:#f5f3ef;
}
.brand{
display:flex;
align-items:center;
gap:13px;
font-size:15px;
font-weight:600;
letter-spacing:.34em;
}
.brand img{
width:34px;
height:34px;
object-fit:contain;
}
.main-nav{
display:flex;
gap:34px;
font-size:12px;
}
.main-nav a{
opacity:.65;
transition:opacity .25s ease;
}
.main-nav a:hover,
.main-nav a.active{
opacity:1;
}
.rooted-entry{
justify-self:end;
font-size:12px;
}
.rooted-entry span{
margin-left:9px;
}
.section-index,
.eyebrow{
margin:0;
font-size:10px;
letter-spacing:.28em;
font-weight:600;
}
.manifesto{
position:relative;
min-height:100vh;
overflow:hidden;
padding:160px 7vw 50px;
display:flex;
flex-direction:column;
justify-content:center;
background:
radial-gradient(
circle at 70% 44%,
rgba(191,164,126,.16),
transparent 24%
),
radial-gradient(
circle at 70% 44%,
rgba(255,255,255,.05),
transparent 45%
),
#080909;
color:#f4f2ee;
}
.manifesto-content{
position:relative;
z-index:2;
}
.manifesto h1{
max-width:1100px;
margin:34px 0 0;
font-size:clamp(48px,6.4vw,105px);
line-height:.94;
letter-spacing:-.055em;
font-weight:400;
}
.manifesto-answer{
margin:42px 0 0;
color:#c9b59a;
font-size:clamp(25px,3vw,50px);
line-height:1.04;
letter-spacing:-.035em;
}
.manifesto-orbit{
position:absolute;
width:min(62vw,850px);
aspect-ratio:1;
right:-5%;
top:50%;
transform:translateY(-50%);
border:1px solid rgba(255,255,255,.12);
border-radius:50%;
}
.manifesto-orbit::before,
.manifesto-orbit::after{
content:"";
position:absolute;
inset:14%;
border:1px solid rgba(202,180,148,.13);
border-radius:50%;
transform:rotate(38deg) scaleY(.48);
}
.manifesto-orbit::after{
transform:rotate(-35deg) scaleY(.34);
}
.manifesto-foot{
position:absolute;
bottom:40px;
left:7vw;
right:7vw;
display:flex;
justify-content:space-between;
color:#8f9290;
font-size:10px;
letter-spacing:.12em;
}
.scroll-note b{
margin-left:12px;
color:#c9b59a;
}
.context{
position:relative;
min-height:900px;
padding:130px 7vw;
display:grid;
grid-template-columns:.25fr 1fr 1fr;
gap:5vw;
overflow:hidden;
}
.section-number{
font-size:11px;
color:#999;
}
.context-heading h2,
.principles-heading h2,
.systems-copy h2{
margin:25px 0 0;
font-size:clamp(50px,6vw,90px);
line-height:.94;
letter-spacing:-.055em;
font-weight:400;
}
.context-copy{
padding-top:52px;
max-width:480px;
font-size:17px;
line-height:1.65;
color:#666;
}
.context-copy .lead{
color:#111;
font-size:25px;
line-height:1.35;
}
.context-map{
grid-column:2/4;
position:relative;
height:340px;
margin-top:60px;
border-top:1px solid #ccc;
}
.context-map span{
position:absolute;
font-size:12px;
color:#777;
}
.context-map span:nth-child(1){left:5%;top:20%;}
.context-map span:nth-child(2){left:24%;top:70%;}
.context-map span:nth-child(3){left:37%;top:17%;}
.context-map span:nth-child(4){left:48%;top:78%;}
.context-map span:nth-child(5){right:35%;top:15%;}
.context-map span:nth-child(6){right:20%;top:72%;}
.context-map span:nth-child(7){right:6%;top:23%;}
.context-map span:nth-child(8){right:4%;top:79%;}
.context-core{
position:absolute;
left:50%;
top:50%;
width:115px;
height:115px;
transform:translate(-50%,-50%);
border:1px solid #aaa;
border-radius:50%;
display:grid;
place-items:center;
font-size:10px;
letter-spacing:.25em;
}
.his{
padding:120px 7vw;
background:#090a0a;
color:#f4f2ee;
}
.his-top{
display:flex;
justify-content:space-between;
}
.eyebrow.light{
color:#c4ad8d;
}
.his-number{
color:#777;
font-size:11px;
}
.his-grid{
margin-top:90px;
display:grid;
grid-template-columns:1fr 1fr;
gap:8vw;
}
.his-grid h2{
margin:0;
font-size:clamp(54px,6vw,96px);
line-height:.92;
font-weight:400;
letter-spacing:-.055em;
}
.his-definition{
align-self:end;
max-width:570px;
}
.definition-label{
font-size:9px;
color:#777;
letter-spacing:.25em;
}
.definition{
font-size:24px;
line-height:1.45;
color:#b8bab8;
}
.his-flow{
margin-top:120px;
padding-top:35px;
border-top:1px solid #292b2b;
display:grid;
grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
gap:30px;
}
.his-flow div span{
display:block;
color:#8c775d;
font-size:10px;
margin-bottom:25px;
}
.his-flow strong{
display:block;
font-size:20px;
font-weight:400;
}
.his-flow p{
color:#777;
line-height:1.5;
font-size:13px;
}
.his-flow i{
align-self:center;
color:#555;
font-style:normal;
}
.convergence{
padding:130px 7vw;
background:#dedbd5;
}
.convergence-heading{
display:grid;
grid-template-columns:1fr 2fr;
}
.convergence-heading h2{
margin:0;
font-size:clamp(58px,7vw,105px);
line-height:.92;
letter-spacing:-.06em;
font-weight:400;
}
.convergence-columns{
margin-top:110px;
display:grid;
grid-template-columns:1fr .5fr 1fr;
gap:5vw;
}
.convergence-columns article{
border-top:1px solid #aaa;
padding-top:24px;
}
.convergence-columns article > span{
font-size:9px;
letter-spacing:.25em;
}
.convergence-columns h3{
margin:40px 0;
font-size:40px;
line-height:1.05;
font-weight:400;
}
.convergence-columns p{
color:#666;
line-height:1.65;
max-width:400px;
}
.convergence-axis{
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
gap:20px;
}
.convergence-axis img{
width:90px;
height:90px;
object-fit:contain;
}
.convergence-axis span{
font-size:9px;
letter-spacing:.35em;
}
.principles{
padding:130px 7vw;
}
.principles{
display:grid;
grid-template-columns:.9fr 1.1fr;
gap:9vw;
}
.principle-list article{
display:grid;
grid-template-columns:60px .8fr 1fr;
gap:20px;
padding:27px 0;
border-top:1px solid #ccc;
}
.principle-list span{
font-size:10px;
color:#999;
}
.principle-list h3{
margin:0;
font-size:21px;
font-weight:400;
}
.principle-list p{
margin:0;
color:#777;
font-size:13px;
line-height:1.55;
}
.systems{
padding:130px 7vw;
background:#171818;
color:#f5f3ef;
display:grid;
grid-template-columns:1fr 1fr;
gap:10vw;
}
.systems-copy > p:last-child{
max-width:500px;
color:#8e9290;
line-height:1.65;
margin-top:40px;
}
.rooted-card{
align-self:end;
min-height:380px;
padding:35px;
border:1px solid #414343;
display:flex;
flex-direction:column;
justify-content:space-between;
transition:
transform .4s ease,
border-color .4s ease;
}
.rooted-card:hover{
transform:translateY(-8px);
border-color:#a38d70;
}
.product-number{
color:#9c866a;
font-size:9px;
letter-spacing:.25em;
}
.rooted-card h3{
margin:0;
font-size:55px;
font-weight:400;
letter-spacing:-.04em;
}
.rooted-card p{
color:#8d918f;
}
.rooted-card b{
align-self:flex-end;
font-size:24px;
font-weight:400;
}
.closing{
min-height:85vh;
padding:120px 7vw;
background:#080909;
color:#f5f3ef;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
text-align:center;
}
.closing img{
width:70px;
height:70px;
object-fit:contain;
margin-bottom:60px;
}
.closing p{
color:#777;
font-size:clamp(22px,2.2vw,35px);
line-height:1.25;
}
.closing h2{
margin:15px 0 50px;
font-size:clamp(48px,6vw,90px);
line-height:.98;
letter-spacing:-.055em;
font-weight:400;
}
.closing a{
padding:15px 23px;
border:1px solid #555;
border-radius:30px;
font-size:12px;
}
.closing a span{
margin-left:18px;
}
footer{
padding:55px 7vw 30px;
display:grid;
grid-template-columns:1.3fr 1fr .7fr;
grid-template-rows:auto auto;
gap:45px;
background:#f4f2ee;
align-items:start;
}
.footer-brand{
display:flex;
align-items:center;
gap:15px;
}
.footer-brand img{
width:38px;
height:38px;
object-fit:contain;
}
.footer-brand strong{
display:block;
font-size:16px;
letter-spacing:.34em;
}
.footer-brand small{
display:block;
margin-top:7px;
color:#888;
font-size:11px;
}
footer nav{
display:flex;
gap:28px;
font-size:11px;
}
footer > p{
margin:0;
color:#666;
font-size:12px;
}
.copyright{
grid-column:1/-1;
border-top:1px solid #d3d3d3;
padding-top:20px;
color:#999;
font-size:9px;
}
.reveal{
opacity:0;
transform:translateY(30px);
transition:
opacity .9s cubic-bezier(.16,1,.3,1),
transform .9s cubic-bezier(.16,1,.3,1);
}
.reveal.visible{
opacity:1;
transform:none;
}
@media(max-width:900px){
.site-header{
grid-template-columns:1fr auto;
}
.main-nav{
display:none;
}
.context,
.principles,
.systems{
grid-template-columns:1fr;
}
.context-map{
grid-column:auto;
}
.his-grid,
.convergence-columns{
grid-template-columns:1fr;
}
.convergence-axis{
padding:50px 0;
}
.his-flow{
grid-template-columns:1fr 1fr;
}
.his-flow i{
display:none;
}
}
@media(max-width:650px){
.site-header{
padding:22px 6vw;
}
.brand{
font-size:12px;
}
.brand img{
width:29px;
height:29px;
}
.rooted-entry{
font-size:10px;
}
.manifesto{
padding:130px 6vw 80px;
}
.manifesto h1{
font-size:48px;
}
.manifesto-answer{
font-size:28px;
}
.context,
.his,
.convergence,
.principles,
.systems,
.closing{
padding-left:6vw;
padding-right:6vw;
}
.context{
display:block;
}
.context-heading{
margin-top:40px;
}
.context-copy{
padding-top:25px;
}
.context-map{
height:400px;
}
.his-flow{
grid-template-columns:1fr;
}
.convergence-heading{
display:block;
}
.convergence-heading h2{
margin-top:35px;
}
.principle-list article{
grid-template-columns:35px 1fr;
}
.principle-list p{
grid-column:2;
}
.rooted-card{
min-height:300px;
}
footer{
grid-template-columns:1fr;
}
.copyright{
grid-column:auto;
}
}
@media(prefers-reduced-motion:reduce){
html{
scroll-behavior:auto;
}
.reveal{
opacity:1;
transform:none;
transition:none;
}
}
/* ==========================================================
AXISMER PHILOSOPHY V6.1
HUMAN CONTEXT × HUMAN INTELLIGENCE SYSTEMS
========================================================== */
/* ----------------------------------------------------------
02 — HUMAN CONTEXT / CINEMATIC VISUAL
---------------------------------------------------------- */
.context{
padding-bottom:0;
background:
radial-gradient(
circle at 73% 76%,
rgba(185,154,113,.10),
transparent 29%
),
#f4f2ee;
}
.context-visual{
position:relative;
grid-column:1 / -1;
width:calc(100% + 14vw);
height:clamp(520px,58vw,790px);
margin:
80px
-7vw
0;
overflow:hidden;
background:#111;
}
.context-visual-image{
position:absolute;
inset:-4%;
background-image:
url("/assets/img/philosophy/human-intelligence-v61.webp");
background-size:cover;
background-position:center 36%;
transform:scale(1.035);
filter:
saturate(.88)
contrast(1.03);
}
.context-visual-vignette{
position:absolute;
inset:0;
background:
linear-gradient(
180deg,
rgba(244,242,238,.96) 0%,
rgba(244,242,238,.32) 13%,
transparent 32%,
transparent 70%,
rgba(9,10,10,.25) 88%,
#090a0a 100%
),
linear-gradient(
90deg,
rgba(244,242,238,.40),
transparent 28%,
transparent 74%,
rgba(9,10,10,.20)
);
pointer-events:none;
}
.context-visual-labels{
position:absolute;
inset:0;
pointer-events:none;
}
.context-visual-labels span{
position:absolute;
padding:8px 12px;
border:
1px solid
rgba(255,255,255,.18);
border-radius:100px;
background:
rgba(13,14,14,.32);
backdrop-filter:
blur(8px);
-webkit-backdrop-filter:
blur(8px);
color:
rgba(255,255,255,.72);
font-size:9px;
letter-spacing:.17em;
text-transform:uppercase;
}
.context-visual-labels span:nth-child(1){
left:13%;
top:39%;
}
.context-visual-labels span:nth-child(2){
left:27%;
top:67%;
}
.context-visual-labels span:nth-child(3){
left:34%;
top:26%;
}
.context-visual-labels span:nth-child(4){
left:48%;
top:73%;
}
.context-visual-labels span:nth-child(5){
right:34%;
top:24%;
}
.context-visual-labels span:nth-child(6){
right:22%;
top:65%;
}
.context-visual-labels span:nth-child(7){
right:11%;
top:35%;
}
.context-visual-labels span:nth-child(8){
right:8%;
top:73%;
}
/* ----------------------------------------------------------
03 — HUMAN INTELLIGENCE SYSTEMS
---------------------------------------------------------- */
.his{
position:relative;
overflow:hidden;
padding-top:125px;
background:
radial-gradient(
circle at 50% 48%,
rgba(177,144,101,.075),
transparent 28%
),
#090a0a;
}
.his-top,
.his-grid,
.his-flow{
position:relative;
z-index:3;
}
/* ----------------------------------------------------------
INTELLIGENCE ENERGY FIELD
---------------------------------------------------------- */
.his-energy{
position:relative;
z-index:1;
width:calc(100% + 14vw);
height:clamp(400px,46vw,650px);
margin:
70px
-7vw
-15px;
overflow:hidden;
}
.his-energy-image{
position:absolute;
inset:-10% -3%;
background-image:
url("/assets/img/philosophy/human-intelligence-v61.webp");
background-size:cover;
background-position:center 72%;
transform:
scale(1.10)
rotate(180deg);
opacity:.64;
filter:
brightness(.57)
saturate(.88)
contrast(1.14);
}
.his-energy::before{
content:"";
position:absolute;
z-index:2;
inset:0;
background:
linear-gradient(
180deg,
#090a0a 0%,
rgba(9,10,10,.20) 27%,
rgba(9,10,10,.08) 57%,
#090a0a 100%
);
}
.his-energy-glow{
position:absolute;
z-index:3;
left:50%;
top:50%;
width:340px;
height:340px;
transform:
translate(-50%,-50%);
border-radius:50%;
background:
radial-gradient(
circle,
rgba(225,193,148,.24) 0%,
rgba(177,139,92,.09) 27%,
transparent 67%
);
filter:blur(6px);
}
.his-energy-emblem{
position:absolute;
z-index:4;
left:50%;
top:50%;
width:
clamp(86px,8vw,125px);
height:auto;
transform:
translate(-50%,-50%);
object-fit:contain;
filter:
drop-shadow(
0 0 25px
rgba(210,177,131,.25)
);
}
/* ----------------------------------------------------------
FLOW — MORE CINEMATIC
---------------------------------------------------------- */
.his-flow{
margin-top:45px;
padding-top:42px;
padding-bottom:15px;
border-top:
1px solid
rgba(255,255,255,.11);
}
.his-flow strong{
font-size:
clamp(19px,1.55vw,24px);
}
.his-flow div{
transition:
transform .35s ease;
}
.his-flow div:hover{
transform:
translateY(-5px);
}
/* ----------------------------------------------------------
DESKTOP MOTION
---------------------------------------------------------- */
@media (prefers-reduced-motion:no-preference){
.context-visual-image{
animation:
axismerContextDrift
18s
ease-in-out
infinite
alternate;
}
.his-energy-emblem{
animation:
axismerEnergyPulse
5s
ease-in-out
infinite;
}
}
@keyframes axismerContextDrift{
from{
transform:
scale(1.035)
translate3d(-.4%,0,0);
}
to{
transform:
scale(1.075)
translate3d(.7%,-.5%,0);
}
}
@keyframes axismerEnergyPulse{
0%,
100%{
opacity:.82;
filter:
drop-shadow(
0 0 18px
rgba(210,177,131,.18)
);
}
50%{
opacity:1;
filter:
drop-shadow(
0 0 42px
rgba(210,177,131,.42)
);
}
}
/* ----------------------------------------------------------
TABLET
---------------------------------------------------------- */
@media(max-width:900px){
.context-visual{
grid-column:auto;
width:calc(100% + 14vw);
height:620px;
margin-left:-7vw;
margin-right:-7vw;
}
.context-visual-image{
background-position:center center;
}
.his-energy{
height:500px;
}
}
/* ----------------------------------------------------------
MOBILE
---------------------------------------------------------- */
@media(max-width:650px){
.context{
padding-bottom:0;
}
.context-visual{
width:calc(100% + 12vw);
height:560px;
margin:
55px
-6vw
0;
}
.context-visual-image{
inset:-2% -42%;
background-size:auto 100%;
background-position:center center;
}
.context-visual-vignette{
background:
linear-gradient(
180deg,
#f4f2ee 0%,
rgba(244,242,238,.25) 14%,
transparent 30%,
rgba(9,10,10,.10) 72%,
#090a0a 100%
);
}
.context-visual-labels span{
font-size:7px;
padding:
6px 8px;
letter-spacing:.12em;
}
.context-visual-labels span:nth-child(1){
left:7%;
top:32%;
}
.context-visual-labels span:nth-child(2){
left:12%;
top:67%;
}
.context-visual-labels span:nth-child(3){
left:37%;
top:23%;
}
.context-visual-labels span:nth-child(4){
left:40%;
top:77%;
}
.context-visual-labels span:nth-child(5){
right:8%;
top:31%;
}
.context-visual-labels span:nth-child(6){
right:8%;
top:61%;
}
.context-visual-labels span:nth-child(7),
.context-visual-labels span:nth-child(8){
display:none;
}
.his{
padding-top:95px;
}
.his-grid{
margin-top:65px;
}
.his-energy{
width:calc(100% + 12vw);
height:390px;
margin:
55px
-6vw
0;
}
.his-energy-image{
inset:-5% -50%;
background-size:auto 100%;
background-position:center center;
opacity:.62;
}
.his-energy-glow{
width:240px;
height:240px;
}
.his-energy-emblem{
width:82px;
}
.his-flow{
margin-top:20px;
gap:0;
}
.his-flow > div{
padding:
25px
0;
border-bottom:
1px solid
rgba(255,255,255,.08);
}
}
/* ==========================================================
AXISMER PHILOSOPHY V6.2
SCROLL-DRIVEN CINEMATIC PARALLAX
========================================================== */
.context-visual-image{
animation:none !important;
transform:
translate3d(
0,
var(--axismer-context-y, 0px),
0
)
scale(
var(--axismer-context-scale, 1.07)
);
will-change:transform;
}
.his-energy-image{
transform:
translate3d(
0,
var(--axismer-his-y, 0px),
0
)
scale(1.13);
will-change:transform;
}
/* Remove previous 180-degree rotation */
.his-energy-image{
rotate:0deg;
}
@media(max-width:650px){
.context-visual-image{
transform:
translate3d(
0,
var(--axismer-context-y, 0px),
0
)
scale(1.13);
}
.his-energy-image{
transform:
translate3d(
0,
var(--axismer-his-y, 0px),
0
)
scale(1.20);
}
}
@media(prefers-reduced-motion:reduce){
.context-visual-image,
.his-energy-image{
transform:none !important;
will-change:auto;
}
}
/* ==========================================================
AXISMER PHILOSOPHY V6.3
STABILITY + VISUAL SEPARATION
========================================================== */
/* ----------------------------------------------------------
HUMAN CONTEXT
Keep the cinematic human scene exclusively in section 02
---------------------------------------------------------- */
.context-visual{
isolation:isolate;
}
.context-visual-image{
opacity:1;
}
/* ----------------------------------------------------------
HUMAN INTELLIGENCE SYSTEMS
Remove duplicated human photograph.
Build an abstract intelligence field instead.
---------------------------------------------------------- */
.his-energy{
position:relative;
isolation:isolate;
background:
radial-gradient(
circle at 50% 50%,
rgba(196,164,111,.13) 0%,
rgba(115,133,150,.07) 20%,
rgba(9,10,10,0) 48%
),
#090a0a;
}
/* Hide duplicated photographic layer */
.his-energy-image{
display:none !important;
}
/* Abstract horizontal intelligence field */
.his-energy::after{
content:"";
position:absolute;
inset:8% -8%;
z-index:0;
opacity:.78;
background:
radial-gradient(
ellipse at center,
rgba(216,184,128,.22) 0%,
rgba(216,184,128,.08) 16%,
transparent 43%
),
repeating-radial-gradient(
ellipse at center,
rgba(223,205,174,.13) 0 1px,
transparent 1px 34px
);
transform:scaleX(1.25) scaleY(.58);
filter:
blur(.15px)
drop-shadow(0 0 30px rgba(194,161,108,.08));
pointer-events:none;
}
/* Central glow */
.his-energy-glow{
z-index:1;
opacity:.92;
background:
radial-gradient(
circle,
rgba(232,203,151,.30) 0%,
rgba(189,153,96,.12) 18%,
rgba(102,126,148,.06) 34%,
transparent 63%
);
}
/* Official AXISMER emblem */
.his-energy-emblem{
z-index:3;
opacity:1;
filter:
drop-shadow(0 0 14px rgba(238,211,166,.28))
drop-shadow(0 0 48px rgba(190,151,91,.15));
animation:
axismerV63Pulse 6s ease-in-out infinite;
}
@keyframes axismerV63Pulse{
0%,
100%{
transform:
translate(-50%,-50%)
scale(1);
}
50%{
transform:
translate(-50%,-50%)
scale(1.045);
}
}
/* ----------------------------------------------------------
REVEAL STABILITY
Elements are visible by default.
Animation only activates when JS confirms it is available.
---------------------------------------------------------- */
.reveal{
opacity:1;
transform:none;
}
/*
JS adds .axismer-reveal-ready to .
Only then are unrevealed elements temporarily hidden.
*/
.axismer-reveal-ready .reveal:not(.is-visible){
opacity:0;
transform:translateY(24px);
}
/*
Once visible, never hide again.
*/
.axismer-reveal-ready .reveal.is-visible{
opacity:1;
transform:none;
transition:
opacity .85s cubic-bezier(.2,.7,.2,1),
transform .85s cubic-bezier(.2,.7,.2,1);
}
/* Full-page screenshots / printing must show everything */
@media print{
.reveal,
.axismer-reveal-ready .reveal{
opacity:1 !important;
transform:none !important;
}
}
/* Reduced motion */
@media(prefers-reduced-motion:reduce){
.reveal,
.axismer-reveal-ready .reveal{
opacity:1 !important;
transform:none !important;
transition:none !important;
}
.his-energy-emblem{
animation:none !important;
}
}
/* Mobile */
@media(max-width:650px){
.his-energy{
min-height:390px;
}
.his-energy::after{
inset:12% -45%;
transform:scaleX(1.05) scaleY(.68);
}
}
/* ==========================================================
AXISMER PHILOSOPHY V6.4
FINAL POLISH
========================================================== */
/* ----------------------------------------------------------
02 — HUMAN CONTEXT
Softer cinematic exit into section 03
---------------------------------------------------------- */
.context-visual{
margin-bottom:-1px;
}
.context-visual::after{
content:"";
position:absolute;
z-index:4;
pointer-events:none;
left:0;
right:0;
bottom:0;
height:38%;
background:
linear-gradient(
to bottom,
rgba(9,10,10,0) 0%,
rgba(9,10,10,.18) 30%,
rgba(9,10,10,.72) 76%,
#090a0a 100%
);
}
/* Preserve labels above transition */
.context-visual-labels{
z-index:5;
}
/* ----------------------------------------------------------
03 — HUMAN INTELLIGENCE SYSTEMS
More presence, depth and continuity
---------------------------------------------------------- */
.his{
margin-top:-1px;
background:
radial-gradient(
ellipse at 50% 34%,
rgba(178,147,96,.055) 0%,
rgba(9,10,10,0) 38%
),
#090a0a;
}
.his-energy{
min-height:500px;
margin-top:58px;
margin-bottom:-5px;
background:
radial-gradient(
ellipse at center,
rgba(198,164,107,.09) 0%,
rgba(92,111,128,.045) 24%,
transparent 57%
),
#090a0a;
}
/* Wider, subtler intelligence field */
.his-energy::after{
inset:4% -12%;
opacity:.58;
transform:
scaleX(1.36)
scaleY(.66);
background:
radial-gradient(
ellipse at center,
rgba(226,197,147,.18) 0%,
rgba(196,162,105,.08) 15%,
transparent 42%
),
repeating-radial-gradient(
ellipse at center,
rgba(221,205,177,.10) 0 1px,
transparent 1px 38px
);
}
/* Larger official emblem */
.his-energy-emblem{
width:clamp(112px,8.5vw,150px) !important;
height:auto !important;
filter:
drop-shadow(
0 0 16px
rgba(241,215,171,.32)
)
drop-shadow(
0 0 58px
rgba(196,157,95,.18)
);
}
/* More concentrated energy around emblem */
.his-energy-glow{
width:min(600px,72vw);
height:min(600px,72vw);
left:50%;
top:50%;
transform:translate(-50%,-50%);
background:
radial-gradient(
circle,
rgba(238,210,162,.22) 0%,
rgba(197,160,101,.10) 20%,
rgba(105,129,149,.045) 39%,
transparent 66%
);
}
/* ----------------------------------------------------------
FLOW
Tighten relationship between intelligence field and stages
---------------------------------------------------------- */
.his-flow{
margin-top:30px;
padding-top:34px;
}
/* ----------------------------------------------------------
04 → 07
Preserve editorial sections.
Only subtle rhythm normalization.
---------------------------------------------------------- */
.convergence,
.principles,
.systems,
.closing{
scroll-margin-top:80px;
}
/* ----------------------------------------------------------
RESPONSIVE
---------------------------------------------------------- */
@media(max-width:900px){
.his-energy{
min-height:450px;
}
.his-energy-emblem{
width:112px !important;
}
}
@media(max-width:650px){
.context-visual::after{
height:32%;
}
.his-energy{
min-height:370px;
margin-top:38px;
}
.his-energy-emblem{
width:92px !important;
}
.his-flow{
margin-top:18px;
}
}
/* ----------------------------------------------------------
ACCESSIBILITY
---------------------------------------------------------- */
@media(prefers-reduced-motion:reduce){
.his-energy-emblem{
animation:none !important;
}
}
/* ==========================================================
AXISMER PHILOSOPHY V7
APPROVED DESIGN MATCH
Sections 01–03 only
========================================================== */
/* ==========================================================
01 — MANIFESTO
========================================================== */
.philosophy-v7-manifesto{
position:relative;
min-height:clamp(760px,92vh,980px);
padding:
clamp(150px,18vh,220px)
7vw
72px;
overflow:hidden;
background:#080909;
isolation:isolate;
}
/* Retire old CSS orbit */
.philosophy-v7-manifesto .manifesto-orbit{
display:none !important;
}
/* Real V7 visual */
.v7-hero-visual{
position:absolute;
z-index:0;
top:50%;
right:-2vw;
width:min(66vw,1420px);
aspect-ratio:2172 / 232;
transform:
translateY(-48%)
scale(1.62);
transform-origin:center right;
pointer-events:none;
}
.v7-hero-art{
position:absolute;
inset:0;
background:
url("/assets/img/philosophy/v7/philosophy-hero-v7.webp")
center center / 100% 100%
no-repeat;
filter:
brightness(.98)
contrast(1.06)
saturate(.95);
opacity:.98;
}
.v7-hero-shade{
position:absolute;
inset:-4px;
background:
linear-gradient(
90deg,
#080909 0%,
rgba(8,9,9,.94) 12%,
rgba(8,9,9,.48) 31%,
rgba(8,9,9,.05) 56%,
rgba(8,9,9,0) 100%
);
}
/* Hero content remains real HTML */
.philosophy-v7-manifesto .manifesto-content,
.philosophy-v7-manifesto .manifesto-foot{
position:relative;
z-index:3;
}
.philosophy-v7-manifesto .manifesto-content{
width:min(680px,52vw);
}
.philosophy-v7-manifesto h1{
max-width:680px;
}
.philosophy-v7-manifesto .manifesto-answer{
position:relative;
padding-top:34px;
}
.philosophy-v7-manifesto .manifesto-answer::before{
content:"";
position:absolute;
left:0;
top:0;
width:42px;
height:1px;
background:
rgba(214,182,126,.72);
}
/* ==========================================================
02 — HUMAN CONTEXT
========================================================== */
.philosophy-v7-context{
position:relative;
min-height:clamp(800px,88vh,980px);
padding:
clamp(110px,12vh,150px)
7vw
clamp(100px,12vh,145px);
display:grid;
grid-template-columns:
minmax(52px,.22fr)
minmax(330px,.85fr)
minmax(540px,1.65fr);
grid-template-rows:auto 1fr;
column-gap:clamp(30px,4vw,78px);
overflow:hidden;
background:
linear-gradient(
90deg,
#f3efe7 0%,
#f0ece4 31%,
#ddd9d0 48%,
#8f9190 70%,
#101212 100%
);
isolation:isolate;
}
/* Number */
.philosophy-v7-context > .section-number{
position:relative;
z-index:4;
grid-column:1;
grid-row:1;
align-self:start;
}
/* Heading + copy become left editorial column */
.philosophy-v7-context .context-heading{
position:relative;
z-index:4;
grid-column:2;
grid-row:1;
align-self:start;
}
.philosophy-v7-context .context-copy{
position:relative;
z-index:4;
grid-column:2;
grid-row:2;
align-self:start;
width:min(100%,480px);
margin-top:48px;
}
/* V7 visual fills the right side */
.philosophy-v7-context .context-visual{
position:absolute;
z-index:1;
top:0;
right:-1px;
bottom:0;
width:66%;
height:auto;
margin:0;
overflow:hidden;
background:#111313;
}
/* Replace old V6 visual */
.philosophy-v7-context .context-visual-image{
position:absolute;
inset:0;
opacity:1;
animation:none !important;
transform:none !important;
background:
url("/assets/img/philosophy/v7/philosophy-human-context-v7.webp")
50% 50% / auto 100%
no-repeat;
filter:
contrast(1.03)
saturate(.92)
brightness(.98);
}
/* Blend image into cream area */
.philosophy-v7-context .context-visual-vignette{
position:absolute;
z-index:2;
inset:0;
background:
linear-gradient(
90deg,
#f0ece4 0%,
rgba(240,236,228,.90) 8%,
rgba(240,236,228,.35) 20%,
rgba(240,236,228,0) 39%
),
linear-gradient(
180deg,
rgba(255,255,255,.05) 0%,
rgba(0,0,0,0) 62%,
rgba(8,9,9,.18) 100%
);
}
/* Remove V6 bottom dark curtain */
.philosophy-v7-context .context-visual::after{
display:none !important;
}
/* Labels float around the human scene */
.philosophy-v7-context .context-visual-labels{
position:absolute;
z-index:5;
inset:0;
pointer-events:none;
}
.philosophy-v7-context
.context-visual-labels span{
position:absolute;
display:flex;
align-items:center;
justify-content:center;
min-width:78px;
padding:9px 15px;
border:
1px solid
rgba(255,255,255,.26);
border-radius:999px;
background:
rgba(15,17,17,.30);
backdrop-filter:blur(12px);
-webkit-backdrop-filter:blur(12px);
color:
rgba(255,255,255,.90);
font-size:10px;
letter-spacing:.10em;
text-transform:uppercase;
box-shadow:
0 8px 30px
rgba(0,0,0,.12);
}
.philosophy-v7-context
.context-visual-labels span:nth-child(1){
top:19%;
left:34%;
}
.philosophy-v7-context
.context-visual-labels span:nth-child(2){
top:15%;
right:8%;
}
.philosophy-v7-context
.context-visual-labels span:nth-child(3){
top:42%;
left:24%;
}
.philosophy-v7-context
.context-visual-labels span:nth-child(4){
top:39%;
right:11%;
}
.philosophy-v7-context
.context-visual-labels span:nth-child(5){
bottom:27%;
left:30%;
}
.philosophy-v7-context
.context-visual-labels span:nth-child(6){
bottom:22%;
right:10%;
}
.philosophy-v7-context
.context-visual-labels span:nth-child(7){
bottom:9%;
left:43%;
}
.philosophy-v7-context
.context-visual-labels span:nth-child(8){
bottom:8%;
right:18%;
}
/* ==========================================================
03 — HUMAN INTELLIGENCE SYSTEMS
========================================================== */
.philosophy-v7-his{
position:relative;
padding:
clamp(115px,12vh,155px)
7vw
115px;
overflow:hidden;
background:#080909;
isolation:isolate;
}
/* Editorial content */
.philosophy-v7-his .his-top,
.philosophy-v7-his .his-grid,
.philosophy-v7-his .his-flow{
position:relative;
z-index:5;
}
.philosophy-v7-his .his-grid{
margin-top:72px;
grid-template-columns:
minmax(390px,.95fr)
minmax(360px,.82fr);
gap:
clamp(80px,10vw,180px);
}
/* Main V7 energy composition */
.philosophy-v7-his .his-energy{
position:relative;
z-index:1;
width:calc(100% + 14vw);
height:
clamp(430px,42vw,650px);
min-height:0;
margin:
45px
-7vw
0;
overflow:hidden;
background:#080909;
}
/* Restore image layer, now using V7 asset */
.philosophy-v7-his .his-energy-image{
display:block !important;
position:absolute;
inset:0;
opacity:1;
transform:none !important;
background:
url("/assets/img/philosophy/v7/philosophy-his-v7.webp")
center center / 100% 100%
no-repeat;
filter:
contrast(1.06)
saturate(1.02)
brightness(.96);
}
/* Dark edge integration */
.philosophy-v7-his .his-energy::before{
content:"";
position:absolute;
z-index:2;
inset:0;
background:
linear-gradient(
180deg,
#080909 0%,
rgba(8,9,9,.28) 16%,
rgba(8,9,9,0) 35%,
rgba(8,9,9,0) 69%,
rgba(8,9,9,.40) 87%,
#080909 100%
),
linear-gradient(
90deg,
#080909 0%,
rgba(8,9,9,0) 15%,
rgba(8,9,9,0) 85%,
#080909 100%
);
pointer-events:none;
}
/* Retire V6 artificial rings */
.philosophy-v7-his .his-energy::after{
display:none !important;
}
/* Asset already contains the visual core.
Official emblem is layered over its center. */
.philosophy-v7-his .his-energy-glow{
position:absolute;
z-index:3;
left:50%;
top:50%;
width:min(520px,40vw);
aspect-ratio:1;
transform:
translate(-50%,-50%);
background:
radial-gradient(
circle,
rgba(236,202,145,.16) 0%,
rgba(185,148,89,.07) 23%,
transparent 65%
);
pointer-events:none;
}
.philosophy-v7-his .his-energy-emblem{
position:absolute;
z-index:4;
left:50%;
top:50%;
width:
clamp(105px,8vw,145px)
!important;
height:auto !important;
opacity:1;
transform:
translate(-50%,-50%);
animation:
axismerV7Core
6.5s
ease-in-out
infinite;
filter:
drop-shadow(
0 0 16px
rgba(244,217,170,.34)
)
drop-shadow(
0 0 55px
rgba(195,156,95,.20)
);
}
@keyframes axismerV7Core{
0%,
100%{
transform:
translate(-50%,-50%)
scale(1);
}
50%{
transform:
translate(-50%,-50%)
scale(1.035);
}
}
/* Flow sits directly below energy convergence */
.philosophy-v7-his .his-flow{
margin-top:10px;
padding-top:36px;
}
/* ==========================================================
DESKTOP — LARGE
========================================================== */
@media(min-width:1500px){
.v7-hero-visual{
width:min(64vw,1500px);
transform:
translateY(-48%)
scale(1.68);
}
}
/* ==========================================================
TABLET
========================================================== */
@media(max-width:1000px){
.philosophy-v7-manifesto{
min-height:820px;
}
.v7-hero-visual{
width:90vw;
right:-28vw;
top:47%;
transform:
translateY(-50%)
scale(1.55);
opacity:.82;
}
.philosophy-v7-manifesto
.manifesto-content{
width:min(650px,78vw);
}
.philosophy-v7-context{
min-height:1050px;
grid-template-columns:
52px 1fr;
grid-template-rows:
auto auto 1fr;
background:#f1ede5;
}
.philosophy-v7-context
.context-heading{
grid-column:2;
}
.philosophy-v7-context
.context-copy{
grid-column:2;
grid-row:2;
margin-top:40px;
}
.philosophy-v7-context
.context-visual{
top:auto;
left:0;
right:0;
bottom:0;
width:100%;
height:54%;
}
.philosophy-v7-context
.context-visual-image{
background-size:auto 100%;
background-position:center center;
}
.philosophy-v7-context
.context-visual-vignette{
background:
linear-gradient(
180deg,
#f1ede5 0%,
rgba(241,237,229,.62) 11%,
rgba(241,237,229,0) 30%
);
}
.philosophy-v7-his
.his-grid{
grid-template-columns:1fr;
gap:48px;
}
.philosophy-v7-his
.his-energy{
height:440px;
}
}
/* ==========================================================
MOBILE
========================================================== */
@media(max-width:650px){
.philosophy-v7-manifesto{
min-height:760px;
padding:
135px
24px
48px;
}
.v7-hero-visual{
top:57%;
right:-58vw;
width:155vw;
transform:
translateY(-50%)
scale(1.45);
opacity:.68;
}
.v7-hero-shade{
background:
linear-gradient(
90deg,
#080909 0%,
rgba(8,9,9,.91) 27%,
rgba(8,9,9,.35) 61%,
rgba(8,9,9,0) 100%
);
}
.philosophy-v7-manifesto
.manifesto-content{
width:100%;
}
.philosophy-v7-context{
min-height:980px;
padding:
90px
24px
70px;
grid-template-columns:1fr;
grid-template-rows:auto auto auto;
}
.philosophy-v7-context
> .section-number{
grid-column:1;
grid-row:1;
margin-bottom:32px;
}
.philosophy-v7-context
.context-heading{
grid-column:1;
grid-row:2;
}
.philosophy-v7-context
.context-copy{
grid-column:1;
grid-row:3;
width:100%;
margin-top:34px;
padding-bottom:480px;
}
.philosophy-v7-context
.context-visual{
height:470px;
}
.philosophy-v7-context
.context-visual-labels span{
transform:scale(.86);
}
.philosophy-v7-context
.context-visual-labels
span:nth-child(7),
.philosophy-v7-context
.context-visual-labels
span:nth-child(8){
display:none;
}
.philosophy-v7-his{
padding:
90px
24px
80px;
}
.philosophy-v7-his
.his-grid{
margin-top:52px;
}
.philosophy-v7-his
.his-energy{
width:calc(100% + 48px);
height:320px;
margin:
38px
-24px
0;
}
.philosophy-v7-his
.his-energy-image{
background-size:auto 100%;
}
.philosophy-v7-his
.his-energy-emblem{
width:82px !important;
}
}
/* ==========================================================
ACCESSIBILITY
========================================================== */
@media(prefers-reduced-motion:reduce){
.philosophy-v7-his
.his-energy-emblem{
animation:none !important;
}
}
/* ==========================================================
AXISMER PHILOSOPHY V7.1
APPROVED COMPOSITION FIX
01–03 ONLY
========================================================== */
/* ==========================================================
01 — MANIFESTO
Restore the approved wide editorial composition
========================================================== */
.philosophy-v7-manifesto{
min-height:clamp(720px,88vh,900px);
padding-top:
clamp(150px,17vh,205px);
}
/* Give headline the horizontal proportion of the mockup */
.philosophy-v7-manifesto .manifesto-content{
width:min(760px,58vw);
}
.philosophy-v7-manifesto h1{
max-width:760px;
font-size:
clamp(52px,5.2vw,84px);
line-height:.98;
letter-spacing:-.052em;
}
/* Larger orbital scene on the right */
.v7-hero-visual{
top:50%;
right:-7vw;
width:min(76vw,1550px);
aspect-ratio:auto;
height:72%;
transform:none;
translate:0 -50%;
overflow:hidden;
}
/*
Do NOT stretch the panoramic asset.
Increase it proportionally and crop inside the visual window.
*/
.v7-hero-art{
inset:-18% -8%;
background-size:auto 78%;
background-position:center right;
background-repeat:no-repeat;
transform:scale(1.48);
transform-origin:center right;
}
/* More gradual transition from copy into visual */
.v7-hero-shade{
inset:0;
background:
linear-gradient(
90deg,
#080909 0%,
rgba(8,9,9,.98) 15%,
rgba(8,9,9,.84) 29%,
rgba(8,9,9,.34) 47%,
rgba(8,9,9,.04) 66%,
rgba(8,9,9,0) 100%
);
}
/* ==========================================================
02 — HUMAN CONTEXT
Remove inherited V6 capsules completely
========================================================== */
.philosophy-v7-context{
min-height:
clamp(760px,82vh,900px);
}
/*
The V7 artwork already communicates the life dimensions.
Old HTML labels were inheriting V6 geometry and obscuring
the human figure. They must not render.
*/
.philosophy-v7-context .context-visual-labels,
.philosophy-v7-context .context-visual-labels span,
.philosophy-v7-context .context-visual-labels span:nth-child(n){
display:none !important;
}
/* Increase artwork presence */
.philosophy-v7-context .context-visual{
width:68%;
}
/*
Keep correct aspect ratio.
Crop horizontally rather than stretching.
*/
.philosophy-v7-context .context-visual-image{
inset:-2% -5%;
background-size:auto 106%;
background-position:center right;
background-repeat:no-repeat;
transform:none !important;
}
/* Cleaner cream → image integration */
.philosophy-v7-context .context-visual-vignette{
background:
linear-gradient(
90deg,
#f1ede5 0%,
rgba(241,237,229,.97) 8%,
rgba(241,237,229,.72) 16%,
rgba(241,237,229,.24) 27%,
rgba(241,237,229,0) 43%
),
linear-gradient(
180deg,
rgba(255,255,255,.03) 0%,
transparent 74%,
rgba(8,9,9,.10) 100%
);
}
/* Keep editorial copy clearly above artwork */
.philosophy-v7-context > .section-number,
.philosophy-v7-context .context-heading,
.philosophy-v7-context .context-copy{
z-index:8;
}
/* ==========================================================
03 — HUMAN INTELLIGENCE SYSTEMS
Integrate energy field with title and definition
========================================================== */
.philosophy-v7-his{
padding-bottom:105px;
background:
radial-gradient(
ellipse at 50% 47%,
rgba(70,101,124,.06) 0%,
transparent 44%
),
#080909;
}
/*
Pull the energy scene upward so it visually belongs
to the heading instead of reading as a separate banner.
*/
.philosophy-v7-his .his-energy{
z-index:1;
height:
clamp(480px,46vw,690px);
margin-top:-90px;
pointer-events:none;
}
/* Keep actual content over the energy */
.philosophy-v7-his .his-top,
.philosophy-v7-his .his-grid{
z-index:6;
}
.philosophy-v7-his .his-flow{
z-index:7;
margin-top:-36px;
background:
linear-gradient(
180deg,
rgba(8,9,9,0) 0%,
rgba(8,9,9,.82) 27%,
#080909 62%
);
}
/* Energy asset — proportional crop, no distortion */
.philosophy-v7-his .his-energy-image{
inset:-3% -3%;
background-size:auto 100%;
background-position:center center;
background-repeat:no-repeat;
transform:scale(1.10) !important;
}
/* Softer integration around all four edges */
.philosophy-v7-his .his-energy::before{
background:
linear-gradient(
180deg,
#080909 0%,
rgba(8,9,9,.74) 8%,
rgba(8,9,9,.16) 25%,
rgba(8,9,9,0) 42%,
rgba(8,9,9,0) 68%,
rgba(8,9,9,.50) 88%,
#080909 100%
),
linear-gradient(
90deg,
#080909 0%,
rgba(8,9,9,.38) 7%,
transparent 20%,
transparent 80%,
rgba(8,9,9,.38) 93%,
#080909 100%
);
}
/* Align official emblem with the convergence */
.philosophy-v7-his .his-energy-emblem{
width:
clamp(110px,7.5vw,142px)
!important;
}
/* ==========================================================
TABLET
========================================================== */
@media(max-width:1000px){
.philosophy-v7-manifesto
.manifesto-content{
width:min(680px,78vw);
}
.v7-hero-visual{
right:-30vw;
width:112vw;
height:64%;
opacity:.78;
}
.v7-hero-art{
background-size:auto 72%;
transform:scale(1.42);
}
.philosophy-v7-context
.context-visual{
width:100%;
}
.philosophy-v7-context
.context-visual-image{
background-size:auto 100%;
background-position:center center;
}
.philosophy-v7-his
.his-energy{
margin-top:-30px;
height:470px;
}
.philosophy-v7-his
.his-flow{
margin-top:-15px;
}
}
/* ==========================================================
MOBILE
========================================================== */
@media(max-width:650px){
.philosophy-v7-manifesto h1{
font-size:
clamp(43px,12vw,62px);
max-width:100%;
}
.v7-hero-visual{
top:58%;
right:-82vw;
width:190vw;
height:55%;
opacity:.60;
}
.v7-hero-art{
background-size:auto 68%;
transform:scale(1.36);
}
.philosophy-v7-context{
min-height:960px;
}
.philosophy-v7-context
.context-visual{
height:450px;
}
.philosophy-v7-context
.context-visual-image{
inset:0 -35%;
background-size:auto 100%;
background-position:center center;
}
.philosophy-v7-his
.his-energy{
height:330px;
margin-top:10px;
}
.philosophy-v7-his
.his-energy-image{
inset:0 -55%;
background-size:auto 100%;
transform:scale(1.05) !important;
}
.philosophy-v7-his
.his-flow{
margin-top:0;
background:none;
}
}
/* ==========================================================
AXISMER PHILOSOPHY — V7.2 HD PREVIEW
Sections 01–03 only
Installed as isolated override.
========================================================== */
/* ==========================================================
01 — MANIFESTO
========================================================== */
.philosophy-v7-manifesto .v7-hero-visual{
position:absolute;
top:0;
right:0;
bottom:0;
width:66%;
overflow:hidden;
opacity:1;
pointer-events:none;
}
.philosophy-v7-manifesto .v7-hero-art{
position:absolute;
inset:0;
background-image:
url("/assets/img/philosophy/v72/philosophy-hero-v72-hd.webp?v=72");
/*
IMPORTANT:
Never enlarge vertically to fill the section.
Native artwork ratio is preserved.
*/
background-size:100% auto;
background-repeat:no-repeat;
background-position:right center;
transform:none !important;
}
.philosophy-v7-manifesto .v7-hero-shade{
position:absolute;
inset:0;
background:
linear-gradient(
90deg,
#080909 0%,
rgba(8,9,9,.98) 10%,
rgba(8,9,9,.82) 25%,
rgba(8,9,9,.30) 48%,
rgba(8,9,9,0) 72%
),
linear-gradient(
180deg,
#080909 0%,
rgba(8,9,9,0) 24%,
rgba(8,9,9,0) 76%,
#080909 100%
);
}
.philosophy-v7-manifesto .manifesto-content{
position:relative;
z-index:10;
}
/* ==========================================================
02 — HUMAN CONTEXT
========================================================== */
.philosophy-v7-context{
overflow:hidden;
}
.philosophy-v7-context .context-visual{
position:absolute;
top:0;
right:0;
bottom:0;
width:66%;
overflow:hidden;
pointer-events:none;
}
.philosophy-v7-context .context-visual-image{
position:absolute;
inset:0;
background-image:
url("/assets/img/philosophy/v72/philosophy-human-context-v72-hd.webp?v=72");
background-size:100% auto;
background-repeat:no-repeat;
background-position:right center;
transform:none !important;
}
.philosophy-v7-context .context-visual-vignette{
position:absolute;
inset:0;
background:
linear-gradient(
90deg,
#f1ede5 0%,
rgba(241,237,229,.98) 8%,
rgba(241,237,229,.82) 18%,
rgba(241,237,229,.38) 31%,
rgba(241,237,229,0) 48%
),
linear-gradient(
180deg,
#f1ede5 0%,
rgba(241,237,229,0) 18%,
rgba(241,237,229,0) 82%,
#f1ede5 100%
);
}
.philosophy-v7-context .context-visual-labels{
display:none !important;
}
/* ==========================================================
03 — HUMAN INTELLIGENCE SYSTEMS
========================================================== */
.philosophy-v7-his .his-energy{
position:relative;
width:100%;
height:clamp(300px,22vw,420px);
margin-top:10px;
overflow:hidden;
pointer-events:none;
}
.philosophy-v7-his .his-energy-image{
position:absolute;
inset:0;
background-image:
url("/assets/img/philosophy/v72/philosophy-his-v72-hd.webp?v=72");
background-size:100% auto;
background-repeat:no-repeat;
background-position:center center;
transform:none !important;
}
.philosophy-v7-his .his-energy::before{
content:"";
position:absolute;
inset:0;
z-index:2;
background:
linear-gradient(
180deg,
#080909 0%,
rgba(8,9,9,.42) 13%,
rgba(8,9,9,0) 30%,
rgba(8,9,9,0) 70%,
rgba(8,9,9,.46) 88%,
#080909 100%
),
linear-gradient(
90deg,
#080909 0%,
rgba(8,9,9,.20) 8%,
transparent 20%,
transparent 80%,
rgba(8,9,9,.20) 92%,
#080909 100%
);
}
/*
Official AXISMER emblem remains HTML,
therefore it stays sharp independently
of the generated artwork.
*/
.philosophy-v7-his .his-energy-emblem{
position:absolute;
z-index:5;
width:clamp(105px,7vw,135px) !important;
left:50%;
top:50%;
transform:translate(-50%,-50%) !important;
}
/* ==========================================================
TABLET
========================================================== */
@media(max-width:1000px){
.philosophy-v7-manifesto .v7-hero-visual{
width:82%;
right:-16%;
}
.philosophy-v7-manifesto .v7-hero-art{
background-size:100% auto;
transform:none !important;
}
.philosophy-v7-context .context-visual{
width:78%;
right:-12%;
}
.philosophy-v7-context .context-visual-image{
background-size:100% auto;
transform:none !important;
}
.philosophy-v7-his .his-energy{
height:330px;
margin-top:20px;
}
.philosophy-v7-his .his-energy-image{
background-size:100% auto;
transform:none !important;
}
}
/* ==========================================================
MOBILE
========================================================== */
@media(max-width:650px){
.philosophy-v7-manifesto .v7-hero-visual{
top:46%;
right:-25%;
width:125%;
height:48%;
}
.philosophy-v7-manifesto .v7-hero-art{
background-size:100% auto;
background-position:center center;
transform:none !important;
}
.philosophy-v7-context .context-visual{
top:auto;
right:-22%;
bottom:0;
width:144%;
height:410px;
}
.philosophy-v7-context .context-visual-image{
inset:0;
background-size:100% auto;
background-position:center center;
transform:none !important;
}
.philosophy-v7-his .his-energy{
height:230px;
margin-top:30px;
}
.philosophy-v7-his .his-energy-image{
inset:0;
background-size:100% auto;
background-position:center center;
transform:none !important;
}
}
/* ==========================================================
AXISMER PHILOSOPHY — V7.2.1
01 MANIFESTO ONLY
========================================================== */
@media(min-width:1001px){
.philosophy-v7-manifesto{
position:relative;
overflow:hidden;
background:#080909;
}
/*
Give the artwork a much larger horizontal stage.
We preserve its native aspect ratio.
*/
.philosophy-v7-manifesto .v7-hero-visual{
top:0;
right:0;
bottom:0;
width:69%;
height:100%;
opacity:1;
overflow:hidden;
}
/*
Artwork becomes a deliberate cinematic layer rather
than attempting to fill the entire hero vertically.
*/
.philosophy-v7-manifesto .v7-hero-art{
position:absolute;
top:50%;
right:-2%;
width:100%;
height:auto;
aspect-ratio:1859 / 279;
inset:auto -2% auto auto;
background-image:
url("/assets/img/philosophy/v72/philosophy-hero-v72-hd.webp?v=721");
background-size:100% 100%;
background-position:center;
background-repeat:no-repeat;
transform:translateY(-50%) !important;
filter:
contrast(1.05)
saturate(1.04);
opacity:1;
}
/*
Blend the horizontal artwork into the surrounding
obsidian canvas so its rectangular boundaries disappear.
*/
.philosophy-v7-manifesto .v7-hero-shade{
z-index:2;
background:
linear-gradient(
90deg,
#080909 0%,
#080909 8%,
rgba(8,9,9,.94) 17%,
rgba(8,9,9,.56) 29%,
rgba(8,9,9,.12) 44%,
rgba(8,9,9,0) 62%
),
linear-gradient(
180deg,
#080909 0%,
rgba(8,9,9,.92) 13%,
rgba(8,9,9,.28) 31%,
rgba(8,9,9,0) 43%,
rgba(8,9,9,0) 57%,
rgba(8,9,9,.30) 70%,
rgba(8,9,9,.92) 87%,
#080909 100%
);
}
/*
Editorial text remains completely independent
from the visual.
*/
.philosophy-v7-manifesto .manifesto-content{
position:relative;
z-index:10;
width:min(760px,51vw);
}
}
/* ==========================================================
AXISMER PHILOSOPHY — V7.2.2
SECTION 01 — CORRECTED COMPOSITION
========================================================== */
@media(min-width:1001px){
.philosophy-v7-manifesto{
min-height:760px;
position:relative;
overflow:hidden;
background:#080909;
}
/* Right visual stage */
.philosophy-v7-manifesto .v7-hero-visual{
position:absolute;
top:50%;
right:-3%;
width:62%;
height:430px;
bottom:auto;
transform:translateY(-50%);
overflow:hidden;
opacity:1;
z-index:1;
}
/* Actual V7.2 artwork */
.philosophy-v7-manifesto .v7-hero-art{
position:absolute;
inset:0;
width:100%;
height:100%;
aspect-ratio:auto;
background-image:
url("/assets/img/philosophy/v72/philosophy-hero-v72-hd.webp?v=722");
background-repeat:no-repeat;
/*
Controlled enlargement.
Do NOT use cover.
*/
background-size:100% auto;
background-position:center center;
transform:none !important;
filter:
contrast(1.08)
saturate(1.08);
opacity:1;
}
/*
Hide the rectangular boundaries of the source artwork.
*/
.philosophy-v7-manifesto .v7-hero-shade{
position:absolute;
inset:0;
z-index:2;
background:
linear-gradient(
90deg,
#080909 0%,
rgba(8,9,9,.96) 8%,
rgba(8,9,9,.72) 19%,
rgba(8,9,9,.22) 35%,
rgba(8,9,9,0) 52%
),
linear-gradient(
180deg,
#080909 0%,
rgba(8,9,9,.78) 17%,
rgba(8,9,9,0) 35%,
rgba(8,9,9,0) 65%,
rgba(8,9,9,.78) 83%,
#080909 100%
);
}
/* Text column */
.philosophy-v7-manifesto .manifesto-content{
position:relative;
z-index:10;
width:47%;
max-width:720px;
}
.philosophy-v7-manifesto h1{
position:relative;
z-index:10;
}
.philosophy-v7-manifesto .manifesto-belief{
position:relative;
z-index:10;
}
}
/* Remove inherited decorative/orbit elements behind the copy */
.philosophy-v7-manifesto .manifesto-orbit{
display:none !important;
}
/* ==========================================================
END V7.2.2
========================================================== */
/* ==========================================================
AXISMER PHILOSOPHY — V7.2.3
01 CLEAN HOLDING STATE
========================================================== */
.philosophy-v7-manifesto{
background:
radial-gradient(
ellipse at 78% 47%,
rgba(177,143,91,.035) 0%,
rgba(8,9,9,0) 38%
),
#080909;
}
/* Current panoramic source is unsuitable for the final hero. */
.philosophy-v7-manifesto .v7-hero-visual{
display:none !important;
}
/* Remove inherited orbit artwork. */
.philosophy-v7-manifesto .manifesto-orbit{
display:none !important;
}
/* Keep editorial copy clean and dominant. */
.philosophy-v7-manifesto .manifesto-content{
position:relative;
z-index:10;
}
/* ==========================================================
END V7.2.3
========================================================== */
/* ==========================================================
AXISMER PHILOSOPHY — V7.2.4
SECTION 02 — HUMAN CONTEXT REBUILD
Desktop only
========================================================== */
@media(min-width:1001px){
/* ------------------------------------------------------
SECTION CANVAS
------------------------------------------------------ */
.philosophy-v7-context{
position:relative !important;
min-height:760px !important;
overflow:hidden !important;
background:#f1ede5 !important;
display:block !important;
}
/* ------------------------------------------------------
NUMBER
------------------------------------------------------ */
.philosophy-v7-context > .section-number{
position:absolute !important;
top:72px !important;
left:7% !important;
z-index:20 !important;
}
/* ------------------------------------------------------
HEADING
------------------------------------------------------ */
.philosophy-v7-context .context-heading{
position:absolute !important;
top:70px !important;
left:17% !important;
width:29% !important;
max-width:430px !important;
z-index:20 !important;
margin:0 !important;
}
.philosophy-v7-context .context-heading h2{
margin-top:20px !important;
font-size:
clamp(58px,4.8vw,82px) !important;
line-height:.94 !important;
letter-spacing:-.055em !important;
}
/* ------------------------------------------------------
BODY COPY
------------------------------------------------------ */
.philosophy-v7-context .context-copy{
position:absolute !important;
left:17% !important;
bottom:90px !important;
width:28% !important;
max-width:430px !important;
z-index:20 !important;
margin:0 !important;
}
.philosophy-v7-context .context-copy .lead{
max-width:390px !important;
}
/* ------------------------------------------------------
VISUAL STAGE
------------------------------------------------------ */
.philosophy-v7-context .context-visual{
position:absolute !important;
top:0 !important;
right:0 !important;
bottom:0 !important;
left:auto !important;
width:58% !important;
height:100% !important;
margin:0 !important;
overflow:hidden !important;
z-index:2 !important;
background:
linear-gradient(
90deg,
#f1ede5 0%,
rgba(241,237,229,.55) 10%,
rgba(241,237,229,0) 24%
) !important;
}
/* ------------------------------------------------------
PANORAMIC ARTWORK
Important:
the source is only 1859×276.
We deliberately use it as a wide cinematic composition.
------------------------------------------------------ */
.philosophy-v7-context .context-visual-image{
position:absolute !important;
top:50% !important;
right:-3% !important;
left:auto !important;
bottom:auto !important;
width:108% !important;
height:auto !important;
aspect-ratio:1859 / 276 !important;
background-image:
url("/assets/img/philosophy/v72/philosophy-human-context-v72-hd.webp?v=724") !important;
background-size:100% 100% !important;
background-repeat:no-repeat !important;
background-position:center center !important;
transform:
translateY(-50%) !important;
filter:
contrast(1.04)
saturate(1.03) !important;
opacity:1 !important;
}
/* ------------------------------------------------------
SEAMLESS BLENDING
------------------------------------------------------ */
.philosophy-v7-context .context-visual-vignette{
display:block !important;
position:absolute !important;
inset:0 !important;
z-index:5 !important;
pointer-events:none !important;
background:
linear-gradient(
90deg,
#f1ede5 0%,
rgba(241,237,229,.96) 6%,
rgba(241,237,229,.68) 15%,
rgba(241,237,229,.18) 27%,
rgba(241,237,229,0) 40%
),
linear-gradient(
180deg,
#f1ede5 0%,
rgba(241,237,229,.90) 12%,
rgba(241,237,229,.12) 32%,
rgba(241,237,229,0) 43%,
rgba(241,237,229,0) 57%,
rgba(241,237,229,.12) 68%,
rgba(241,237,229,.90) 88%,
#f1ede5 100%
) !important;
}
/* Remove inherited overlays */
.philosophy-v7-context .context-visual::before,
.philosophy-v7-context .context-visual::after{
display:none !important;
content:none !important;
}
/* Generated artwork already contains the visual dimensions. */
.philosophy-v7-context .context-visual-labels,
.philosophy-v7-context .context-visual-labels span{
display:none !important;
}
}
/* ==========================================================
END V7.2.4
========================================================== */
/* ==========================================================
AXISMER PHILOSOPHY — V7.2.5
SECTION 03 — FINAL POLISH
========================================================== */
@media(min-width:1001px){
.philosophy-v7-his .his-energy{
position:relative !important;
height:330px !important;
margin-top:20px !important;
border:0 !important;
overflow:hidden !important;
background:#080909 !important;
}
.philosophy-v7-his .his-energy-image{
position:absolute !important;
inset:0 !important;
background-image:
url("/assets/img/philosophy/v72/philosophy-his-v72-hd.webp?v=725") !important;
background-size:100% auto !important;
background-position:center center !important;
background-repeat:no-repeat !important;
transform:none !important;
filter:
contrast(1.06)
saturate(1.05) !important;
}
/*
Integrate the panoramic artwork into the black canvas.
This removes the visible banner boundaries.
*/
.philosophy-v7-his .his-energy::before{
display:block !important;
content:"" !important;
position:absolute !important;
inset:0 !important;
z-index:3 !important;
pointer-events:none !important;
background:
linear-gradient(
180deg,
#080909 0%,
rgba(8,9,9,.88) 8%,
rgba(8,9,9,.34) 18%,
rgba(8,9,9,0) 31%,
rgba(8,9,9,0) 69%,
rgba(8,9,9,.34) 82%,
rgba(8,9,9,.88) 92%,
#080909 100%
),
linear-gradient(
90deg,
#080909 0%,
rgba(8,9,9,.48) 5%,
rgba(8,9,9,0) 16%,
rgba(8,9,9,0) 84%,
rgba(8,9,9,.48) 95%,
#080909 100%
) !important;
}
.philosophy-v7-his .his-energy::after{
display:none !important;
content:none !important;
}
/*
Keep official emblem crisp and independent
from the generated artwork.
*/
.philosophy-v7-his .his-energy-emblem{
z-index:6 !important;
width:clamp(105px,7vw,132px) !important;
filter:
drop-shadow(0 0 22px rgba(213,177,112,.18)) !important;
}
}
/* ==========================================================
END V7.2.5
========================================================== */
/* ==========================================================
AXISMER PHILOSOPHY — HERO 01
CLEAN PRODUCTION IMPLEMENTATION
Asset: emblema-dorado.webp — 1672 × 941
========================================================== */
/* ---------- DESKTOP ---------- */
@media (min-width:1001px){
.philosophy-v7-manifesto{
position:relative !important;
box-sizing:border-box !important;
height:calc(100vh - 135px) !important;
min-height:650px !important;
max-height:850px !important;
padding:120px 7vw 90px !important;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
overflow:hidden !important;
background:#080909 !important;
}
/* Complete 16:9 artwork */
.philosophy-v7-manifesto .v7-hero-visual{
display:block !important;
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
aspect-ratio:auto !important;
translate:none !important;
transform:none !important;
opacity:1 !important;
overflow:hidden !important;
pointer-events:none !important;
z-index:1 !important;
}
.philosophy-v7-manifesto .v7-hero-art{
display:block !important;
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
aspect-ratio:auto !important;
background:
url("/assets/img/philosophy/hero/emblema-dorado.webp?v=10")
center center / cover
no-repeat !important;
translate:none !important;
transform:none !important;
filter:none !important;
opacity:1 !important;
}
/* Editorial transition */
.philosophy-v7-manifesto .v7-hero-shade{
display:block !important;
position:absolute !important;
inset:0 !important;
z-index:2 !important;
background:
linear-gradient(
90deg,
rgba(8,9,9,.97) 0%,
rgba(8,9,9,.90) 18%,
rgba(8,9,9,.58) 31%,
rgba(8,9,9,.18) 44%,
rgba(8,9,9,0) 57%
),
linear-gradient(
180deg,
rgba(8,9,9,.12) 0%,
rgba(8,9,9,0) 25%,
rgba(8,9,9,0) 75%,
rgba(8,9,9,.32) 100%
) !important;
}
.philosophy-v7-manifesto .manifesto-orbit{
display:none !important;
}
/* Real editorial copy */
.philosophy-v7-manifesto .manifesto-content{
position:relative !important;
z-index:10 !important;
width:min(680px,44vw) !important;
}
.philosophy-v7-manifesto h1{
max-width:680px !important;
}
/*
* IMPORTANT:
* Restore footer to ABSOLUTE.
* A historical V7 rule changed it to relative,
* causing "Human Intelligence Systems" to overlap
* the manifesto answer.
*/
.philosophy-v7-manifesto .manifesto-foot{
position:absolute !important;
left:7vw !important;
right:7vw !important;
bottom:36px !important;
display:flex !important;
justify-content:space-between !important;
align-items:center !important;
z-index:10 !important;
color:#8f9290 !important;
font-size:10px !important;
letter-spacing:.12em !important;
pointer-events:none !important;
}
.philosophy-v7-manifesto .scroll-note{
margin-left:auto !important;
}
}
/* ---------- TABLET ---------- */
@media (min-width:651px) and (max-width:1000px){
.philosophy-v7-manifesto .v7-hero-visual{
display:block !important;
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
aspect-ratio:auto !important;
translate:none !important;
transform:none !important;
opacity:1 !important;
}
.philosophy-v7-manifesto .v7-hero-art{
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
aspect-ratio:auto !important;
background:
url("/assets/img/philosophy/hero/emblema-dorado.webp?v=10")
58% center / cover
no-repeat !important;
translate:none !important;
transform:none !important;
}
.philosophy-v7-manifesto .v7-hero-shade{
position:absolute !important;
inset:0 !important;
background:
linear-gradient(
90deg,
rgba(8,9,9,.96) 0%,
rgba(8,9,9,.78) 35%,
rgba(8,9,9,.22) 70%,
rgba(8,9,9,.04) 100%
) !important;
}
.philosophy-v7-manifesto .manifesto-foot{
position:absolute !important;
left:7vw !important;
right:7vw !important;
bottom:32px !important;
z-index:10 !important;
}
}
/* ---------- MOBILE ---------- */
@media (max-width:650px){
.philosophy-v7-manifesto .v7-hero-visual{
display:block !important;
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
aspect-ratio:auto !important;
translate:none !important;
transform:none !important;
opacity:.72 !important;
}
.philosophy-v7-manifesto .v7-hero-art{
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
aspect-ratio:auto !important;
background:
url("/assets/img/philosophy/hero/emblema-dorado.webp?v=10")
67% center / cover
no-repeat !important;
translate:none !important;
transform:none !important;
}
.philosophy-v7-manifesto .v7-hero-shade{
position:absolute !important;
inset:0 !important;
background:
linear-gradient(
180deg,
rgba(8,9,9,.90) 0%,
rgba(8,9,9,.55) 38%,
rgba(8,9,9,.18) 67%,
rgba(8,9,9,.72) 100%
) !important;
}
.philosophy-v7-manifesto .manifesto-foot{
position:absolute !important;
left:7vw !important;
right:7vw !important;
bottom:24px !important;
z-index:10 !important;
}
}
/* ==========================================================
END AXISMER PHILOSOPHY HERO 01
========================================================== */
/* ==========================================================
HERO 01 — FINAL ART POSITION
Slightly smaller orbital system + more breathing room
========================================================== */
@media (min-width:1001px){
.philosophy-v7-manifesto .v7-hero-art{
background-size:auto 91% !important;
background-position:right center !important;
background-repeat:no-repeat !important;
background-color:#080909 !important;
}
}
/* END HERO 01 FINAL ART POSITION */
/* ==========================================================
AXISMER HEADER — HOME MASTER
Philosophy uses the exact Home geometry.
========================================================== */
@media (min-width:901px){
.site-header{
position:absolute !important;
z-index:100 !important;
top:0 !important;
left:0 !important;
width:100% !important;
height:94px !important;
padding:0 6.5vw !important;
display:grid !important;
grid-template-columns:1fr auto 1fr !important;
align-items:center !important;
box-sizing:border-box !important;
}
.site-header .brand{
display:flex !important;
align-items:center !important;
justify-self:start !important;
width:auto !important;
height:auto !important;
margin:0 !important;
padding:0 !important;
gap:0 !important;
}
/*
* EXACT HOME LOGO GEOMETRY
*/
.site-header .brand img,
.site-header .brand .brand-logo{
display:block !important;
width:215px !important;
height:auto !important;
max-width:none !important;
max-height:74px !important;
margin:0 !important;
padding:0 !important;
object-fit:contain !important;
object-position:left center !important;
transform:none !important;
filter:
drop-shadow(0 0 14px rgba(217,210,201,.10)) !important;
}
}
/* HOME TABLET GEOMETRY */
@media (min-width:601px) and (max-width:900px){
.site-header .brand img,
.site-header .brand .brand-logo{
width:170px !important;
height:auto !important;
max-height:62px !important;
}
}
/* HOME MOBILE GEOMETRY */
@media (max-width:600px){
.site-header .brand img,
.site-header .brand .brand-logo{
width:145px !important;
height:auto !important;
max-height:54px !important;
}
}
/* END AXISMER HEADER HOME MASTER */
/* ==========================================================
AXISMER — PREMIUM GLOBAL NAVIGATION
Wordmark-inspired navigation
========================================================== */
@media (min-width:901px){
/* ---------- CENTRAL NAV ---------- */
.site-header .main-nav{
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:38px !important;
font-size:11px !important;
font-weight:500 !important;
text-transform:uppercase !important;
letter-spacing:.19em !important;
color:#f6f5f3 !important;
}
.site-header .main-nav a{
position:relative !important;
display:inline-flex !important;
align-items:center !important;
padding:12px 2px 13px !important;
color:rgba(246,245,243,.76) !important;
opacity:1 !important;
text-shadow:
0 0 18px rgba(246,245,243,.08) !important;
transition:
color .35s ease,
text-shadow .35s ease,
transform .35s cubic-bezier(.16,1,.3,1) !important;
}
/*
* Fine metallic line.
* Hidden until hover / active.
*/
.site-header .main-nav a::after{
content:"" !important;
position:absolute !important;
left:50% !important;
bottom:5px !important;
width:0 !important;
height:1px !important;
background:
linear-gradient(
90deg,
transparent,
#bfa47e 25%,
#f0dfc5 50%,
#bfa47e 75%,
transparent
) !important;
opacity:0 !important;
transform:translateX(-50%) !important;
box-shadow:
0 0 9px rgba(217,190,151,.35) !important;
transition:
width .4s cubic-bezier(.16,1,.3,1),
opacity .3s ease !important;
}
.site-header .main-nav a:hover{
color:#fffaf2 !important;
transform:translateY(-1px) !important;
text-shadow:
0 0 16px rgba(255,240,216,.20),
0 0 32px rgba(191,164,126,.12) !important;
}
.site-header .main-nav a:hover::after{
width:72% !important;
opacity:1 !important;
}
/* ---------- ACTIVE PAGE ---------- */
.site-header .main-nav a.active{
color:#e6cfad !important;
text-shadow:
0 0 14px rgba(217,190,151,.16) !important;
}
.site-header .main-nav a.active::after{
width:48% !important;
opacity:.9 !important;
}
/* ---------- ROOTED LIFE CTA ---------- */
.site-header .rooted-entry{
justify-self:end !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-height:40px !important;
padding:0 18px !important;
border:1px solid rgba(217,210,201,.28) !important;
border-radius:3px !important;
background:
linear-gradient(
180deg,
rgba(255,255,255,.045),
rgba(255,255,255,.012)
) !important;
color:#f6f5f3 !important;
font-size:10px !important;
font-weight:500 !important;
text-transform:uppercase !important;
letter-spacing:.16em !important;
backdrop-filter:blur(12px) !important;
-webkit-backdrop-filter:blur(12px) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.045),
0 8px 30px rgba(0,0,0,.10) !important;
transition:
border-color .35s ease,
background .35s ease,
color .35s ease,
transform .35s cubic-bezier(.16,1,.3,1),
box-shadow .35s ease !important;
}
.site-header .rooted-entry span{
margin-left:10px !important;
color:#d8bc94 !important;
font-size:13px !important;
transition:
transform .35s cubic-bezier(.16,1,.3,1) !important;
}
.site-header .rooted-entry:hover{
color:#fff !important;
border-color:rgba(217,190,151,.62) !important;
background:
linear-gradient(
180deg,
rgba(217,190,151,.11),
rgba(217,190,151,.035)
) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.07),
0 0 24px rgba(191,164,126,.08) !important;
transform:translateY(-1px) !important;
}
.site-header .rooted-entry:hover span{
transform:translate(2px,-2px) !important;
}
}
/* END AXISMER PREMIUM GLOBAL NAVIGATION */