.humo-detail{overflow-x:clip;color:#101214;background:#687b87}
.humo-detail .projects-atmosphere{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:linear-gradient(180deg,#687b87 0%,#a8b8bf 62%,#d9d9d0 100%)}
.humo-detail .projects-atmosphere:before{content:"";position:absolute;inset:48% -4% 0;background:url("https://static.wixstatic.com/media/536243_b4c3a6b48a13448db097463916156a7c~mv2.png") center bottom / 100% 240% no-repeat;filter:grayscale(.9) saturate(.2);opacity:.55;mask-image:linear-gradient(180deg,transparent,#000 35%);-webkit-mask-image:linear-gradient(180deg,transparent,#000 35%)}
.humo-detail .project-cloud{display:block;position:absolute;width:105%;height:70%;bottom:-23%;max-width:none;object-fit:contain;opacity:.9;z-index:1}
.humo-detail .project-cloud-left{left:-53%}
.humo-detail .project-cloud-right{right:-52%;bottom:-18%;transform:scaleX(-1)}
.humo-detail .case-main{position:relative;z-index:1;max-width:1680px;width:92%;padding:clamp(120px,9vw,165px) 0 25px;margin:0 auto;min-height:100svh}
.humo-detail .case-heading{display:flex;align-items:center;gap:4%;margin:0;padding:0 3%}
.humo-detail .case-heading h1{font:400 clamp(60px,6.7vw,108px)/1.04 "Anton",Impact,sans-serif;letter-spacing:-.025em;white-space:nowrap;flex:0 0 43%;margin:0}
.humo-detail .case-heading h1 span{color:#e90029}
.humo-detail .case-heading p{flex:1;max-width:34em;font-size:clamp(16px,1.4vw,23px);font-weight:500;line-height:1.45;border-left:1px solid #22303988;padding:0 0 0 4%;margin:0}
.humo-detail .dae-actions{display:block;position:relative;z-index:2;width:100%;padding:14px 0 calc(8px + env(safe-area-inset-bottom,0px));margin:0;background:transparent;color:#101214;text-align:center}
.humo-detail .dae-actions>p{margin:0 0 20px;font-size:clamp(25px,2.2vw,36px);font-weight:700;line-height:1.25;letter-spacing:-.025em}
.humo-detail .dae-actions>p>span{color:inherit}
.humo-detail .dae-actions nav{display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap}
.humo-detail .dae-actions nav>a{display:inline-flex;justify-content:center;align-items:center;gap:20px;min-height:48px;padding:12px 26px;border:1px solid #27343d99;border-radius:999px;font-size:15px;font-weight:600;line-height:1.3;text-decoration:none;transition:background-color .18s,box-shadow .18s,transform .18s,border-color .18s;color:#151719}
.humo-detail .dae-actions .dae-action-primary{background:#f2ede4;border-color:#b9b1a5;box-shadow:0 2px 5px #27343d16}
.humo-detail .dae-actions .dae-action-next{background:transparent}
.humo-detail .dae-actions nav>a:focus-visible{outline:2px solid #27343d;outline-offset:4px;background:#eee6d9}
.humo-detail .dae-actions nav>a:active{background:#e3d8c6;border-color:#a59a88;box-shadow:0 3px 9px #27343d26;transform:translateY(1px);color:#151719}
.humo-detail .dae-actions small{display:block;position:static;margin:20px 0 0;font-size:10px;line-height:1.5;opacity:.8}
@media(hover:hover){.humo-detail .dae-actions nav>a:hover{background:#e9dfce;border-color:#a59a88;box-shadow:0 4px 10px #27343d24;transform:translateY(-2px);color:#151719}}

/* Humo: original tablet, pencil and four-bottle artwork. */
.humo-detail .case-main{padding-top:clamp(105px,12svh,145px);padding-bottom:20px}
.humo-detail .case-heading h1{font-size:clamp(60px,6.7vw,100px)}
.humo-scene{position:relative;isolation:isolate;display:grid;grid-template-columns:.85fr 1.15fr;align-items:end;gap:7%;width:min(100%,calc((100svh - 450px) * 2));margin:0 auto;padding:36px 0 38px;overflow:clip;overflow-clip-margin:10px}
.humo-piece{position:relative;min-width:0;margin:0;width:100%;isolation:isolate}
.humo-object{position:relative;width:100%;overflow:hidden}
.humo-object>img{display:block;position:absolute;height:auto;max-width:none}
.humo-tablet{margin-bottom:12px}
.humo-tablet .humo-object{aspect-ratio:930/870}
.humo-tablet .humo-object>img{width:176.129%;left:-37.0968%;top:-38.5057%}
.humo-bottles .humo-object{aspect-ratio:1391/1100}
.humo-bottles .humo-object>img{width:117.757%;left:-7.1891%;top:-37.9091%}
.humo-tablet:after{content:"";position:absolute;bottom:-4px;left:2%;right:28%;height:10px;background:radial-gradient(ellipse,#263c5260,transparent 72%);filter:blur(4px);z-index:-1}
.humo-bottles:after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 11% 1.5% at 10% 98%,#263c5255,transparent),radial-gradient(ellipse 11% 1.5% at 37% 79%,#263c5255,transparent),radial-gradient(ellipse 11% 1.5% at 63% 99%,#263c5255,transparent),radial-gradient(ellipse 11% 1.5% at 89% 80%,#263c5255,transparent);filter:blur(3px)}
.humo-reflection{position:absolute;inset:100% 0 auto;height:100%;transform:scaleY(-1);transform-origin:50% 50%;opacity:.13;filter:blur(2px);pointer-events:none;mask-image:linear-gradient(to top,#000,transparent 20%);-webkit-mask-image:linear-gradient(to top,#000,transparent 20%)}
.humo-detail .dae-actions .dae-action-previous{background:transparent}
@media(min-width:701px) and (max-height:649px){.humo-scene{width:85%;max-width:1100px}}
@media(max-width:700px){
.humo-detail .case-main{width:100%;max-width:none;padding:108px 6vw 24px}
.humo-detail .case-heading{display:block;padding:0;margin:0}
.humo-detail .case-heading h1{font-size:clamp(42px,11.5vw,70px);margin:0 0 20px}
.humo-detail .case-heading p{font-size:15px;line-height:1.5;max-width:100%;padding:0;border:0}
.humo-detail .humo-scene{display:flex;flex-direction:column;align-items:center;gap:64px;width:100%;padding:38px 0 50px}
.humo-detail .humo-tablet{width:85%;margin:0}
.humo-detail .humo-bottles{width:100%}
.humo-detail .projects-atmosphere:before{inset:38% -30% 0;background-size:auto 190%;opacity:.42}
.humo-detail .project-cloud{width:180%;height:62%;bottom:-15%}
.humo-detail .project-cloud-left{left:-120%}
.humo-detail .project-cloud-right{right:-120%;bottom:-10%}
.humo-detail .dae-actions{padding-top:0}
.humo-detail .dae-actions>p{font-size:26px;margin-bottom:20px}
.humo-detail .dae-actions nav{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;max-width:350px;margin:auto}
.humo-detail .dae-actions nav>a{width:100%;min-height:48px;font-size:12px;padding:12px 10px;gap:8px}
.humo-detail .dae-actions .dae-action-primary{grid-column:1/-1;grid-row:1;font-size:14px}
.humo-detail .dae-actions .dae-action-previous{grid-column:1;grid-row:2}
.humo-detail .dae-actions .dae-action-next{grid-column:2;grid-row:2}
}
@media(prefers-reduced-motion:reduce){.humo-detail .dae-actions nav>a{transition:none}}

/* Each original bottle reflects from its own contact point. */
.humo-detail .humo-scene{padding-bottom:78px}
.humo-detail .humo-reflection{opacity:.12;filter:blur(2px);mask-image:linear-gradient(to top,#000 0%,#0009 5%,transparent 17%);-webkit-mask-image:linear-gradient(to top,#000 0%,#0009 5%,transparent 17%)}
.humo-detail .humo-bottle-reflection{position:absolute;inset:auto;left:var(--reflection-left);top:var(--reflection-top);width:var(--reflection-width);height:auto;aspect-ratio:var(--reflection-ratio);z-index:-1}
.humo-bottle-reflection .humo-reflection-crop{position:relative;width:100%;height:100%;overflow:hidden}
.humo-bottle-reflection img{display:block;position:absolute;max-width:none;height:auto;width:var(--source-width);left:var(--source-left);top:var(--source-top)}
@media(max-width:700px){.humo-detail .humo-scene{padding-bottom:78px}}

/* Original high-resolution artwork, with independent pencil and wordmark. */
.humo-detail .humo-scene{grid-template-columns:.72fr .8fr 1.35fr;gap:4%;width:min(100%,calc((100svh - 450px) * 2.5))}
.humo-detail .humo-tablet{margin-bottom:8px}
.humo-detail .humo-tablet .humo-object{aspect-ratio:938/1282;overflow:visible}
.humo-tablet-art{position:absolute;inset:0;overflow:hidden}
.humo-tablet-art img{position:absolute;max-width:none;height:auto;width:174.627%;left:-36.4606%;top:-29.2512%}
.humo-pencil-art{position:absolute;bottom:0;left:65%;width:40%;aspect-ratio:364/954;overflow:hidden;filter:drop-shadow(2px 3px 2px #18263526);z-index:1}
.humo-pencil-art img{position:absolute;max-width:none;height:auto;width:450%;left:-174.176%;top:-61.216%}
.humo-detail .humo-tablet:after{left:0;right:0}
.humo-wordmark{margin-bottom:clamp(70px,8vw,110px)}
.humo-wordmark-art{position:relative;width:100%;aspect-ratio:1390/520;overflow:hidden}
.humo-wordmark-art img{position:absolute;max-width:none;height:auto;width:117.842%;left:-5.03597%;top:-134.615%}
@media(min-width:701px) and (max-height:649px){.humo-detail .humo-scene{width:100%;max-width:1200px}}
@media(max-width:700px){.humo-detail .humo-scene{width:100%;gap:54px}.humo-detail .humo-tablet{width:67%;margin:0}.humo-detail .humo-wordmark{width:78%;margin:0}.humo-detail .humo-bottles{width:100%}}
/* Contact shadows centered precisely under the original bottle bases. */
.humo-detail .humo-bottles:after{display:none}
.humo-contact-shadow{position:absolute;display:block;height:9px;transform:translate(-50%,-40%);border-radius:50%;background:radial-gradient(ellipse at center,#26313d52 0%,#26313d24 35%,transparent 73%);filter:blur(2px);pointer-events:none;z-index:-1}
.humo-detail .humo-bottle-reflection{opacity:.085;filter:blur(2px)}

/* Larger original central wordmark, with breathing room on both sides. */
@media(min-width:701px){.humo-detail .humo-wordmark{transform:scale(1.22);transform-origin:50% 60%}}
@media(max-width:700px){.humo-detail .humo-wordmark{width:94%}}

/* v99: four visible contact shadows, each anchored to its bottle base. */
.humo-detail .humo-contact-shadow{height:clamp(10px,1vw,16px);transform:translate(-50%,-28%);background:radial-gradient(ellipse at center,#202e3d9c 0%,#26374770 24%,#26374735 48%,transparent 74%);filter:blur(2.2px);z-index:0}
.humo-detail .humo-bottles>.humo-object{z-index:1}
.humo-detail .humo-bottle-reflection{opacity:.17;filter:blur(1.5px)}
@media(max-width:700px){.humo-detail .humo-contact-shadow{height:10px;filter:blur(1.8px)}.humo-detail .humo-bottle-reflection{opacity:.15}}

/* v101: individual contact core, soft cast and reflection from the same base. */
.humo-detail .humo-contact-shadow{height:12px;transform:translate(-50%,-35%);background:none;filter:none;z-index:0}
.humo-detail .humo-contact-shadow:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse,#25303d9c 0%,#25303d60 30%,transparent 72%);filter:blur(1.6px)}
.humo-detail .humo-contact-shadow:after{content:"";position:absolute;left:-16%;top:-5px;width:145%;height:19px;background:radial-gradient(ellipse,#33445252 0%,#33445220 40%,transparent 74%);filter:blur(4px);transform:translateX(5%)}
.humo-detail .humo-bottle-reflection{height:64px;aspect-ratio:auto;transform:none;overflow:hidden;opacity:.20;filter:blur(1.3px);z-index:0;mask-image:linear-gradient(to bottom,#000 0%,#0008 32%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#0008 32%,transparent 100%)}
.humo-detail .humo-bottle-reflection .humo-reflection-crop{height:auto;aspect-ratio:var(--reflection-ratio);transform:scaleY(-1)}
@media(max-width:700px){.humo-detail .humo-contact-shadow{height:9px}.humo-detail .humo-contact-shadow:after{height:15px;top:-4px}.humo-detail .humo-bottle-reflection{height:48px;opacity:.18}}
