/* F7 and F8: Inspo 2. Bottom dial menu (F7) or corner list menu (F8), Start a project, connected pill tags,
   Focus services, Europe and worldwide, project prompt, full page contact, four column footer. */
:root{--s5:clamp(48px,4.4vw,72px)}
.z7{position:relative;padding:var(--s5) var(--gut)}
.z7+.z7::before{content:'';position:absolute;left:var(--gut);right:var(--gut);top:0;height:1px;background:var(--line2)}
.z7.dark{background:#0F0F0F;color:#fff;--line:rgba(255,255,255,.16);--line2:rgba(255,255,255,.24);--muted:#8A8A8A;--muted2:#B3B3B3;--soft:#1B1B1B}
.z7.dark::before,.z7.dark+.z7::before,.z7.grey::before{display:none}
.z7.grey{background:#ECECEC}
.z7_h2{margin-top:22px;max-width:15em;font-size:clamp(28px,3vw,46px);font-weight:500;letter-spacing:-.035em;line-height:1.08}
.z7_p{margin-top:16px;max-width:30em;font-size:15.5px;line-height:1.55;color:var(--muted2)}
/* Connected pill tags (Inspo 11) */
.tg7{display:inline-flex;align-items:center}
.tg7 i{position:relative;display:inline-flex;align-items:center;height:32px;padding:0 15px;border-radius:999px;background:#F1F1F1;color:#A0A0A0;font-size:13.5px;font-style:normal;letter-spacing:-.01em}
.tg7 i+i{margin-left:2px}
.tg7 i+i::before{content:'';position:absolute;left:-10px;top:50%;width:16px;height:16px;transform:translateY(-50%);background:#F1F1F1;-webkit-mask:radial-gradient(circle at 50% -2px,transparent 7px,#000 7.5px) top/100% 50% no-repeat,radial-gradient(circle at 50% calc(100% + 2px),transparent 7px,#000 7.5px) bottom/100% 50% no-repeat;mask:radial-gradient(circle at 50% -2px,transparent 7px,#000 7.5px) top/100% 50% no-repeat,radial-gradient(circle at 50% calc(100% + 2px),transparent 7px,#000 7.5px) bottom/100% 50% no-repeat}
.dark .tg7 i,.dark .tg7 i+i::before{background:#1E1E1E;color:#8A8A8A}
.grey .tg7 i,.grey .tg7 i+i::before{background:#E0E0E0}
/* Blurb (Inspo 9) */
.z7_blurb{margin-top:22px;max-width:20em;font-size:clamp(28px,3.3vw,52px);font-weight:500;letter-spacing:-.035em;line-height:1.16}
/* Clients: labels and artists as matching rows */
.z7 .cl7{padding:0;margin-top:clamp(36px,4vw,64px)}
/* Focus services (Inspo 6) */
.fc7{display:grid;grid-template-columns:minmax(0,.8fr) repeat(3,minmax(0,1fr));gap:0 var(--gut);margin-top:clamp(40px,5vw,84px)}
.fc7>div{padding-top:12px;border-top:1px solid var(--line2)}
.fc7>div:first-child{border-top:0;color:var(--muted2);font-size:14px}
.fc7 h3{font-size:14px;font-weight:400;color:var(--muted2)}
.fc7 ul{margin-top:16px;display:grid;gap:6px;font-size:16px}
/* Europe and worldwide */
.ww7{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 var(--gut);align-items:end}
.ww7 .sv6_clk{margin-top:0}
/* Project prompt (Inspo 3) */
.ask7_h{margin-top:22px;max-width:9em;font-size:clamp(52px,8vw,128px);font-weight:500;letter-spacing:-.05em;line-height:.98}
.btn7{display:inline-flex;align-items:center;gap:14px;height:52px;padding:0 8px 0 22px;border-radius:7px;background:#0F0F0F;color:#fff;font-size:17px;font-weight:500;letter-spacing:-.01em;cursor:pointer}
.btn7 .ar{display:grid;place-items:center;width:36px;height:36px;border-radius:5px;background:rgba(255,255,255,.16);transition:transform .5s var(--ease)}
.btn7 .ar svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7}
.btn7:hover .ar{transform:translateX(3px)}
.btn7.sm{height:40px;padding:0 5px 0 15px;font-size:14px;border-radius:6px;gap:10px}
.btn7.sm .ar{width:30px;height:30px;border-radius:4px}
.btn7.light{background:#fff;color:#0F0F0F}.btn7.light .ar{background:#EDEDED}
.ask7 .btn7{margin-top:clamp(32px,3.4vw,52px)}
/* Footer (Inspo 4) */
.ft7{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px var(--gut);font-size:14px;line-height:1.55}
.ft7 h4{margin-bottom:22px;font-size:12px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:#8A8A8A}
.ft7 a,.ft7 span{display:block}
.ft7 a:hover{text-decoration:underline}
.ft7_big{margin-top:clamp(56px,6vw,100px);font-size:clamp(48px,10.5vw,190px);font-weight:500;letter-spacing:-.055em;line-height:.8;white-space:nowrap}
.z7.ft{padding-bottom:28px}
/* Start a project (Inspo 7) and top bar */
.tb7{position:fixed;z-index:110;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;height:68px;padding:0 var(--gut);pointer-events:none;transition:background .4s,box-shadow .4s}
.tb7>*{pointer-events:auto}
.tb7 .wm{opacity:0;transition:opacity .4s;color:#0F0F0F}
.tb7.is_solid{background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 1px 0 #ECECEC}
.tb7.is_solid .wm{opacity:1}
.tb7 .right{display:flex;align-items:center;gap:28px;margin-left:auto}
/* F7 bottom dial (Inspo 1 and 12) */
.dial{position:fixed;z-index:140;left:50%;bottom:0;width:640px;height:170px;transform:translateX(-50%);mix-blend-mode:difference;color:#fff;pointer-events:none}
.dial_hit{position:absolute;inset:40px 60px 0;pointer-events:auto}
.dial:not(.open) .dial_hit{inset:auto 230px 0;height:90px}
.dial_it{position:absolute;left:50%;top:0;white-space:nowrap;font-size:15px;font-weight:500;letter-spacing:-.01em;padding:6px 13px;border-radius:999px;transform-origin:50% 50%;transition:transform .55s var(--ease),opacity .45s var(--ease),background .3s,color .3s;pointer-events:auto;cursor:pointer;opacity:0}
.dial_it.on{background:#fff;color:#000;opacity:1}
.dial.open .dial_it{opacity:var(--o,0)}
.dial.open .dial_it.on{opacity:1}
.dial_lab{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:7px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;pointer-events:auto;cursor:pointer;opacity:.85}
/* F8 corner list menu (Inspo 8) */
.n8_list{position:absolute;z-index:20;left:var(--gut);top:22px;display:grid;gap:2px;font-size:clamp(20px,1.7vw,26px);font-weight:500;letter-spacing:-.02em;line-height:1.25;color:#fff}
.n8_list a:hover{opacity:.6}
.tb7 .n8_line{display:flex;gap:24px;font-size:14px;opacity:0;transform:translateY(-6px);transition:opacity .4s,transform .5s var(--ease);pointer-events:none}
.tb7.is_solid .n8_line{opacity:1;transform:none;pointer-events:auto}
/* Full page contact (Inspo 5) */
.ov7{position:fixed;z-index:200;inset:0;overflow:auto;background:#141414;color:#F2F2F2;opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility 0s linear .5s;--bg:#141414;--fg:#F2F2F2;--muted:#7A7A7A;--muted2:#A8A8A8;--line:rgba(255,255,255,.22);--line2:rgba(255,255,255,.3)}
.ov7.open{opacity:1;visibility:visible;transition:opacity .5s var(--ease)}
.ov7_top{display:flex;justify-content:space-between;align-items:center;height:68px;padding:0 var(--gut);font-size:14px}
.ov7_top button{color:inherit;font-size:14px}
.ov7_g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 var(--gut);padding:clamp(48px,8vh,110px) var(--gut) 80px;max-width:1360px;margin:0 auto}
.ov7_h{font-size:clamp(52px,6.6vw,108px);font-weight:500;letter-spacing:-.05em;line-height:.98}
.ov7_mail{display:inline-block;margin-top:clamp(28px,3vw,44px);font-size:clamp(20px,2vw,30px);font-weight:500;letter-spacing:-.025em;border-bottom:2px solid currentColor;padding-bottom:3px}
.ov7_soc{display:flex;gap:18px;margin-top:18px;font-size:14px;color:#A8A8A8}
.ov7 .x_lab{display:block;margin-bottom:20px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#A8A8A8}
.ov7 .field>span{font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:500;margin-bottom:4px}
.ov7 .field input,.ov7 .field textarea{background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.3);border-radius:0;padding:8px 0;color:#F2F2F2}
.ov7 .field input:focus,.ov7 .field textarea:focus{border-bottom-color:#fff}
.ov7 .cform_send{background:#F2F2F2;color:#141414;border-radius:6px}
@media (max-width:980px){
  .fc7{grid-template-columns:1fr}.fc7>div{margin-top:24px}.ww7,.ov7_g{grid-template-columns:1fr}.ww7 .sv6_clk{margin-top:32px}.ov7_g>div+div{margin-top:48px}
  .ft7{grid-template-columns:1fr 1fr}
  .dial{width:100%}.dial_hit{inset:40px 0 0}
  .tb7 .n8_line{display:none}
}
.tb7:not(.is_solid) .btn7.sm{background:#fff;color:#0F0F0F}
.tb7:not(.is_solid) .btn7.sm .ar{background:#EDEDED}
.tb7:not(.is_solid) .n8_line{color:#fff}
.z7 .cs6 .logos,.z7.cs6 .logos{border-top-color:var(--line)}
.cp{z-index:120}
/* Round 2 amends */
/* Start a project in the menu style: faded pill with a dot icon */
.tb7 .dl{display:inline-flex;align-items:center;gap:8px;font-size:14px;cursor:pointer}
.tb7 .dl.cta{padding:6px 12px;border-radius:999px;background:rgba(15,15,15,.07);font-size:13px}
.tb7:not(.is_solid) .dl{color:#fff}
.tb7:not(.is_solid) .dl.cta{background:rgba(255,255,255,.14)}
.tb7 .n8_line{gap:clamp(16px,2vw,28px)}
/* Dial as curved text in two rows, like Inspo 12 */
.dial{width:760px;height:150px}
.dial_hit{inset:20px 40px 0!important;height:auto!important}
.dial_it{top:0;padding:0;border-radius:0;background:none!important;color:#fff!important;font-size:18px;font-weight:500;letter-spacing:-.02em;opacity:.42!important;transition:transform .6s var(--ease),opacity .35s}
.dial_it.on{opacity:1!important}
.dial_it:hover{opacity:.85!important}
.dial_lab{bottom:14px;font-family:var(--mono);font-size:12px;letter-spacing:.02em;text-transform:none;gap:0}
/* Clients in three columns a side */
.cla3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gut);margin-top:clamp(24px,2.6vw,38px)}
.cla3 .r{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:clamp(14px,1.15vw,17px);font-weight:500;letter-spacing:-.015em;white-space:nowrap;overflow:hidden}
.cla3 .r:first-child{border-top:1px solid var(--line)}
.cla3 .r i{display:block;width:40px;height:40px;flex:none;overflow:hidden;background:var(--soft)}
.cla3 .r i img{width:100%;height:100%;object-fit:cover}
.cla3 .r i.lg{display:grid;place-items:center;background:#F4F4F4}
.cla3 .r i.lg .logo_img{width:auto;height:auto;max-width:82%;max-height:56%}
.cla3 .r.plus{color:var(--muted2);overflow:visible;cursor:default}
.cla3 .r.plus i{display:grid;place-items:center;background:transparent;border:1px solid var(--line2);font-size:18px;font-weight:300;color:var(--fg)}
.cla3 .r.plus .pics{display:inline-flex;margin-left:4px}
.cla3 .r.plus .pics b{display:block;width:28px;height:28px;border-radius:50%;overflow:hidden;border:2px solid var(--bg);margin-left:-8px;opacity:0;transform:translateX(-6px) scale(.8);transition:opacity .4s var(--ease),transform .5s var(--ease)}
.cla3 .r.plus .pics b img{width:100%;height:100%;object-fit:cover}
.cla3 .r.plus:hover .pics b{opacity:.55;transform:none}
.cla3 .r.plus:hover .pics b:nth-child(2){transition-delay:60ms}.cla3 .r.plus:hover .pics b:nth-child(3){transition-delay:120ms}
.z7 .cl7>div{min-width:0}
/* Case studies: artists and labels in one row, then the pill */
.mix7{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:clamp(28px,3vw,44px)}
.mix7 figure{margin:0;width:clamp(56px,5.4vw,78px);aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--soft);display:grid;place-items:center}
.mix7 figure img.ph{width:100%;height:100%;object-fit:cover}
.mix7 figure.lg{background:#F2F2F2}
.mix7 figure.lg .logo_img{width:auto;height:auto;max-width:66%;max-height:40%}
.mix7 .mp{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 18px;border-radius:999px;background:#F1F1F1;color:#7A7A7A;font-size:14px;cursor:default}
.mix7 .mp .pics{display:inline-flex;max-width:0;overflow:hidden;transition:max-width .5s var(--ease)}
.mix7 .mp .pics b{display:block;width:28px;height:28px;flex:none;border-radius:50%;overflow:hidden;border:2px solid #F1F1F1;margin-left:-8px;opacity:.55}
.mix7 .mp .pics b:first-child{margin-left:0}
.mix7 .mp .pics img{width:100%;height:100%;object-fit:cover}
.mix7 .mp:hover .pics{max-width:90px}
.z7_req{display:inline-block;margin-top:12px;font-size:13.5px;color:var(--muted2);border-bottom:1px solid var(--line2)}
@media (max-width:980px){.cla3{grid-template-columns:1fr 1fr}.dial{width:100%}}
.cla3 .r{white-space:normal;min-height:65px;line-height:1.2}
.mix7 figure.lg .logo_img{max-width:76%;max-height:48%}
/* Round 3 amends */
.z7_blurb,.z7_h2,.ask7_h,.ov7_h{text-wrap:balance}
.cla3 .r.plus i{font-style:normal}
.cla3 .r.plus,.mix7 .mp{cursor:pointer}
/* top bar sits above the clients panel, with a close button while it is open */
.tb7{z-index:130}
.tb7 .cpx{display:none;align-items:center;gap:8px;height:32px;padding:0 13px;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;font-size:13px;cursor:pointer}
.tb7 .cpx svg{width:10px;height:10px;stroke:currentColor;stroke-width:1.6}
html.cp_open .tb7{background:transparent!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html.cp_open .tb7 .wm{opacity:1;color:#fff}
html.cp_open .tb7 .dl{color:#fff}
html.cp_open .tb7 .n8_line{opacity:1;transform:none;pointer-events:auto}
html.cp_open .tb7 .dl.cta{background:rgba(255,255,255,.14)}
html.cp_open .tb7 .cpx{display:inline-flex}
/* What we provide: examples appear as pills under the item you hover */
.fc7 li{cursor:default}
.fc7 li .ex{display:flex;flex-wrap:wrap;gap:6px;max-height:0;overflow:hidden;opacity:0;transform:translateY(-4px);transition:max-height .5s var(--ease),opacity .35s,transform .45s var(--ease),margin .4s var(--ease)}
.fc7 li .ex i{font-style:normal;display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:999px;background:rgba(255,255,255,.1);color:#CFCFCF;font-size:12.5px;white-space:nowrap}
.fc7 li:hover .ex{max-height:80px;opacity:1;transform:none;margin:8px 0 6px}
.fc7 li>span:first-child{transition:opacity .3s}
.fc7 ul:hover li:not(:hover)>span:first-child{opacity:.45}
/* Case studies: hover "and many more" and three more portraits slide in after the pill */
.mix7 .mp .pics{display:none}
.mix7 .mpx{display:inline-flex;gap:12px}
.mix7 .mpx figure{width:0;margin-left:-12px;opacity:0;transform:scale(.7);transition:width .5s var(--ease),margin .5s var(--ease),opacity .4s,transform .5s var(--ease)}
.mix7 .mp:hover+.mpx figure,.mix7 .mpx:hover figure{width:clamp(56px,5.4vw,78px);margin-left:0;opacity:1;transform:none}
.mix7 .mp:hover+.mpx figure:nth-child(2),.mix7 .mpx:hover figure:nth-child(2){transition-delay:70ms}
.mix7 .mp:hover+.mpx figure:nth-child(3),.mix7 .mpx:hover figure:nth-child(3){transition-delay:140ms}
/* Password: one pill with the button inside */
.z7.cs6 .pw{display:flex;align-items:center;max-width:420px;height:54px;padding:5px;border-radius:999px;background:#F1F1F1;margin-top:clamp(32px,3.4vw,52px)}
.z7.cs6 .pw input{flex:1;height:100%;padding:0 18px;border:0!important;background:transparent;font-size:15px;outline:none}
.z7.cs6 .pw .btn{--btn_h:44px;border-radius:999px;padding:0 20px;background:#0F0F0F;color:#fff}
.z7.cs6 .pw.shake{animation:shake .45s var(--ease2)}
/* Dial: one centred arc, Menu pill underneath */
.dial{width:820px;height:170px}
.dial_it{transition:transform .6s var(--ease),opacity .45s var(--ease)}
.dial:not(.show) .dial_it{opacity:0!important;pointer-events:none}
.dial:not(.show) .dial_hit{inset:auto 330px 0!important;height:60px!important}
.dial_lab{bottom:14px;height:30px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.6);font-family:var(--font);font-size:12px;letter-spacing:.04em;text-transform:uppercase;align-items:center;opacity:1}
/* Let's connect: centred, clear hierarchy */
.ov7_c{display:flex;flex-direction:column;align-items:center;max-width:780px;margin:0 auto;padding:clamp(40px,7vh,90px) var(--gut) 80px;text-align:center}
.ov7 .tg7 i,.ov7 .tg7 i+i::before{background:#232323;color:#8A8A8A}
.ov7_c .ov7_h{margin-top:22px}
.ov7_lead{margin-top:16px;max-width:30em;font-size:16px;line-height:1.5;color:#A8A8A8}
.ov7_mailrow{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:clamp(28px,3vw,40px)}
.ov7_mailrow .ov7_mail{margin:0}
.ov7_mailrow button{height:34px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.12);color:#F2F2F2;font-size:13px}
.ov7_icons{display:flex;gap:10px;margin-top:18px}
.ov7_icons a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.25);transition:background .3s}
.ov7_icons a:hover{background:rgba(255,255,255,.1)}
.ov7_icons svg{width:18px;height:18px}
.ov7_or{display:flex;align-items:center;gap:16px;width:100%;margin:clamp(36px,4vw,56px) 0 clamp(24px,2.6vw,36px);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#8A8A8A}
.ov7_or::before,.ov7_or::after{content:'';flex:1;height:1px;background:rgba(255,255,255,.16)}
.ov7_card{width:100%;text-align:left}
.ov7_x{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 13px;border-radius:999px;background:rgba(255,255,255,.12);font-size:13px}
.ov7_x svg{width:10px;height:10px;stroke:currentColor;stroke-width:1.6}
.cla3 .r.plus{white-space:nowrap}
/* Round 4 amends */
/* Dial: every character placed on the arc */
.dial:not(.dial_v) .dial_it{width:0;height:0;padding:0!important;transform:none!important;transition:opacity .45s var(--ease)!important}
.dial_it .ch{position:absolute;left:0;top:0;display:block;white-space:pre;line-height:1;transform-origin:50% 50%;transition:transform .6s var(--ease)}
.dial_lab{bottom:12px;height:auto;padding:4px 8px;border:0;border-radius:0;font-family:var(--font);font-size:11px;letter-spacing:.01em;text-transform:lowercase;opacity:.6}
.dial_lab:hover{opacity:1}
.dial{transition:opacity .4s}
/* Close sits below the menu bar */
.tb7 .cpx{display:none!important}
.cpx2{position:fixed;top:80px;right:var(--gut);z-index:3;display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 13px;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;font-size:13px;cursor:pointer}
.cpx2 svg{width:10px;height:10px;stroke:currentColor;stroke-width:1.6}
.cp_list{padding-top:56px}
/* What we provide: pills run along the same line and fade at the column edge, nothing moves */
.fc7 li{display:flex;align-items:center;gap:12px;height:30px;white-space:nowrap}
.fc7 li>span:first-child{flex:none}
.fc7 li .ex{flex:1;min-width:0;max-height:none!important;margin:0!important;flex-wrap:nowrap;overflow:hidden;opacity:0;transform:translateX(-6px);-webkit-mask-image:linear-gradient(90deg,#000 55%,transparent);mask-image:linear-gradient(90deg,#000 55%,transparent);transition:opacity .35s,transform .45s var(--ease)}
.fc7 li:hover .ex{opacity:1;transform:none}
.fc7 li .ex i{height:24px;flex:none}
.fc7 ul{gap:4px}
.fc7{grid-template-columns:minmax(0,.4fr) repeat(3,minmax(0,1fr))}
/* Case studies: five portraits, the last three fading, a slower and staggered way out */
.mix7 .mpx figure{transition:width .7s var(--ease),margin .7s var(--ease),opacity .6s ease,transform .7s var(--ease)}
.mix7 .mpx figure:nth-child(1){transition-delay:160ms}.mix7 .mpx figure:nth-child(2){transition-delay:120ms}.mix7 .mpx figure:nth-child(3){transition-delay:80ms}.mix7 .mpx figure:nth-child(4){transition-delay:40ms}.mix7 .mpx figure:nth-child(5){transition-delay:0ms}
.mix7 .mp:hover+.mpx figure:nth-child(1),.mix7 .mpx:hover figure:nth-child(1){transition-delay:0ms;opacity:1}
.mix7 .mp:hover+.mpx figure:nth-child(2),.mix7 .mpx:hover figure:nth-child(2){transition-delay:60ms;opacity:1}
.mix7 .mp:hover+.mpx figure:nth-child(3),.mix7 .mpx:hover figure:nth-child(3){transition-delay:120ms;opacity:.7}
.mix7 .mp:hover+.mpx figure:nth-child(4),.mix7 .mpx:hover figure:nth-child(4){transition-delay:180ms;opacity:.45}
.mix7 .mp:hover+.mpx figure:nth-child(5),.mix7 .mpx:hover figure:nth-child(5){transition-delay:240ms;opacity:.22}
/* Pill buttons */
.btn7{border-radius:999px;padding:0 6px 0 24px}
.btn7 .ar{border-radius:50%}
.ov7 .cform_send{border-radius:999px}
/* Project prompt */
.ask7_row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:clamp(32px,3.4vw,52px)}
.ask7_row .btn7{margin:0}
.ask7_row .alt{font-size:15px;color:var(--muted2)}
.ask7_row .alt a{color:var(--fg);border-bottom:1px solid var(--line2)}
.ask7_g{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:0 var(--gut);align-items:end}
.ask7_side{padding-bottom:10px}
.ask7_side p{font-size:15.5px;line-height:1.55;color:var(--muted2);max-width:24em}
.ask7_faces{display:flex;margin-top:18px}
.ask7_faces i{display:block;width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid var(--bg);margin-left:-10px;background:var(--soft)}
.ask7_faces i:first-child{margin-left:0}
.ask7_faces img{width:100%;height:100%;object-fit:cover}
@media (max-width:980px){.ask7_g{grid-template-columns:1fr}.ask7_side{margin-top:28px}.fc7 li .ex{display:none}}
.fc7>div,.fc7 ul,.fc7 li{min-width:0}.fc7 li{overflow:hidden}

/* Clients: one aligned header row with counts */
.cl7h{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:clamp(28px,3vw,44px);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted2)}
.cl7h>span{display:flex;justify-content:space-between;align-items:baseline;padding:0 var(--gut) 12px 0;border-bottom:1px solid var(--fg)}
.cl7h>span+span{padding-left:var(--gut);padding-right:0;margin-left:0}
.cl7h b{font-family:var(--mono);font-weight:400;letter-spacing:0}
.z7 .cl7.noh{margin-top:0}
.z7 .cl7.noh .cla3{margin-top:0}
.z7 .cl7.noh .cla3 .r:first-child{border-top:0}

/* Dial v2: always on screen, turns with the scroll */
.dial .dial_it{opacity:1!important;pointer-events:auto}
.dial:not(.show) .dial_it{opacity:1!important;pointer-events:auto}
.dial .dial_it .ch{color:#fff;opacity:1;transition:none}
.dial .dial_it:not(.on) .ch{color:rgba(255,255,255,.42)}
.dial .dial_it.x .ch{color:rgba(255,255,255,.3)}
.dial .dial_it:hover .ch{color:#fff}
.dial.hide .dial_it{opacity:0!important;pointer-events:none}
.dial_hit{display:none}
/* Vertical dial on the left edge (F10) */
.dial_v{position:fixed;z-index:140;left:0;top:50%;bottom:auto;width:0;height:0;transform:none;mix-blend-mode:difference;color:#fff}
.dial_v .dial_it{position:absolute;left:clamp(56px,6vw,96px);top:0;width:auto;height:auto;padding:5px 12px!important;border-radius:999px;font-size:15px;font-weight:500;letter-spacing:-.01em;white-space:nowrap;transform-origin:0 50%;transition:background .3s,color .3s!important;color:rgba(255,255,255,.45)}
.dial_v .dial_it.on{background:#fff;color:#000}
.dial_v .dial_it:hover{color:#fff}
.dial_v .dial_it.on:hover{color:#000}
.dial_v .dial_mark{position:absolute;left:clamp(18px,1.8vw,28px);top:0;transform:translateY(-50%) rotate(-90deg);transform-origin:50% 50%;font-size:12px;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.dial_v .dial_it{background:none!important;color:rgba(255,255,255,.45)!important;font-size:15px!important}.dial_v .dial_it.on{background:#fff!important;color:#000!important}.dial_v .dial_it:not(.on):hover{color:#fff!important}
.dial_v .dial_it{left:clamp(14px,1.4vw,22px)}