/* Shared action controls, based on the cinematic pause button.
   Clickable product/artwork cards and data graphics retain their own geometry. */
:root{
 --control-radius:999px;
 --control-fill:rgba(28,34,44,.88);
 --control-edge:rgba(174,188,205,.66);
 --control-copy:#edf0f6;
 --control-hover-fill:rgba(74,91,116,.45);
 --control-hover-edge:#bdcde2;
}

/* Geometry and colours are shared; individual controls keep their layout and size. */
body :where(
 button:not(:where(.ring-card,.market-garment,.market-card,.academy-course-cover-button,.food-brand,.product-value-chart>button,.product-swatches button)),
 a:is(.button,.nav-contact,.hero-work-link,.text-link,.concept-link,.contact-email,.market-chair-link,.market-store-cta,.viewer-back,.viewer-contact,.back-top),
 .viewer-bottom>a,
 input:is([type="button"],[type="submit"],[type="reset"]),
 select,
 .faq-list summary,
 .interest-options label>span
){
 border-radius:var(--control-radius)!important;
 border:1px solid var(--control-edge)!important;
 background:var(--control-fill)!important;
 color:var(--control-copy)!important;
 background-clip:padding-box!important;
 box-shadow:none;
 text-decoration:none!important;
 transition:background-color .22s ease,border-color .22s ease,box-shadow .22s ease,color .22s ease,transform .22s ease!important;
 -webkit-tap-highlight-color:transparent;
}

/* The reference hover is a quiet fill and rim change, without changing control dimensions. */
@media(hover:hover) and (pointer:fine){
 body :where(
  button:not(:where(.ring-card,.market-garment,.market-card,.academy-course-cover-button,.food-brand,.product-value-chart>button,.product-swatches button)),
  a:is(.button,.nav-contact,.hero-work-link,.text-link,.concept-link,.contact-email,.market-chair-link,.market-store-cta,.viewer-back,.viewer-contact,.back-top),
  .viewer-bottom>a,
  input:is([type="button"],[type="submit"],[type="reset"]),select,.faq-list summary,.interest-options label>span
 ):not(:disabled):not([aria-disabled="true"]):hover{
  background:var(--control-hover-fill)!important;
  border-color:var(--control-hover-edge)!important;
  color:#fff!important;
  box-shadow:0 0 0 3px #c5d9f209,0 6px 22px #0002!important;
 }
}

body :where(
 button:not(:where(.ring-card,.market-garment,.market-card,.academy-course-cover-button,.food-brand,.product-value-chart>button,.product-swatches button)),
 a:is(.button,.nav-contact,.hero-work-link,.text-link,.concept-link,.contact-email,.market-chair-link,.market-store-cta,.viewer-back,.viewer-contact,.back-top),
 .viewer-bottom>a,
 input:is([type="button"],[type="submit"],[type="reset"]),select,.faq-list summary,.interest-options label>span
):focus-visible{
 outline:2px solid #d6e7ff!important;
 outline-offset:4px!important;
 border-color:#d6e7ff!important;
}

/* Same-element state selector, also used by the tab-like demo controls. */
body :where(button):not(:where(.ring-card,.market-garment,.market-card,.academy-course-cover-button,.food-brand,.product-value-chart>button,.product-swatches button)):is([aria-pressed="true"],[aria-selected="true"],[aria-current="step"],.active),
body .interest-options input:checked+span{
 background:#354256!important;
 border-color:#bfd0e7!important;
 color:#f1f6ff!important;
}
body :where(button,input[type="submit"],select):disabled{
 opacity:.42!important;
 cursor:not-allowed!important;
}

/* CTA links become actual pill surfaces, including the header contact link. */
body :where(a:is(.button,.nav-contact,.hero-work-link,.text-link,.concept-link,.contact-email,.market-chair-link,.market-store-cta,.viewer-back,.viewer-contact,.back-top),.viewer-bottom>a){
 display:inline-flex;
 align-items:center;
 justify-content:space-between;
 gap:14px;
 padding:11px 18px!important;
 min-height:40px;
 line-height:1.5;
 max-width:100%;
 box-sizing:border-box;
}
body .contact-email{overflow-wrap:anywhere}
body :where(.product-text-button,.product-record-name,.product-table-client,.product-logout){padding:7px 12px!important}
body :where(.product-table-client small,.product-record-name>span,.product-realism .product-topline>button>span){color:#afc1d9!important}
body :where(.service-tabs [role="tab"]){padding-inline:20px!important}
body .faq-list summary{padding:18px 22px!important;margin-block:10px;line-height:1.5}
body .faq-list summary::after{flex-shrink:0}
body .interest-options label>span{padding:9px 15px}
body .motion-toggle{padding:9px 13px;border-radius:var(--control-radius)!important;min-height:36px}
body .menu-toggle{border-radius:50%!important}

/* Language choices are a single rounded segmented control. */
body .language-switcher{border-radius:var(--control-radius)!important;padding:3px;border-color:var(--control-edge)}
body .language-switcher a{border-radius:var(--control-radius)!important;transition:background-color .22s,border-color .22s,color .22s}
body .language-switcher a[aria-current="true"]{background:#b9c9df!important;color:#142034!important}
body .language-switcher a:hover{background:#495c7880}
body .academy-lesson-tabs>button::after{display:none!important}

/* Material swatches keep their material colour and use the same rounded rim feedback. */
body .product-swatches button{border-radius:50%!important}
@media(hover:hover) and (pointer:fine){body .product-swatches button:hover{outline:2px solid #bdcde2;outline-offset:3px}}

@media(max-width:720px){
 body .motion-toggle{padding:7px;min-height:36px;min-width:36px}
 body .viewer-switchbar{flex-wrap:wrap;gap:12px}
 body .viewer-choose{flex:1;min-width:140px}
 body .viewer-choose select{width:100%}
 body .viewer-back{font-size:9px;padding:10px 13px!important;min-height:38px}
 body .contact-email{font-size:clamp(14px,4vw,20px)}
 body .service-tabs [role="tab"]{padding-inline:16px!important}
 body .faq-list summary{padding:16px 18px!important}
}
@media(prefers-reduced-motion:reduce){
 body :where(button,a.button,.nav-contact,.hero-work-link,.text-link,.concept-link,.contact-email,.market-chair-link,.market-store-cta,.viewer-back,.viewer-contact,.viewer-bottom>a,select,.faq-list summary,.interest-options label>span,.language-switcher a){transition:none!important}
}
.motion-paused body :where(button,a.button,.nav-contact,.hero-work-link,.text-link,.concept-link,.contact-email,.market-chair-link,.market-store-cta,.viewer-back,.viewer-contact,.viewer-bottom>a,select,.faq-list summary,.interest-options label>span,.language-switcher a){transition:none!important}

/* Text-only controls need inset space once their outline becomes visible. */
body :where(.food-nav nav button,.product-story-controls>button,.product-views>button,.work-steps button){padding:9px 14px!important}
body .product-story-controls{flex-wrap:wrap}

/* Liquid glass surface + Interactive Hover Button.
   Original vanilla adaptation; interaction reference: Magic UI (MIT). */
:root{
 --control-fill:rgba(229,239,255,.055);
 --control-edge:rgba(229,239,255,.31);
 --control-hover-fill:rgba(210,228,255,.12);
 --control-hover-edge:rgba(240,247,255,.7);
 --glass-reveal:#d9eafd;
 --glass-reveal-copy:#122036;
}
/* A low-priority anchor keeps hover layers inside ordinary controls without
   replacing the absolute, sticky or fixed positioning owned by a component. */
:where(.glass-control){position:relative}
body .glass-control{
 isolation:isolate;
 border-radius:999px!important;
 border-color:var(--control-edge)!important;
 background:radial-gradient(ellipse at var(--glass-x,50%) var(--glass-y,0%),#ffffff24,transparent 68%),linear-gradient(135deg,#ffffff12,#ffffff02 44%,#b1d4ff0e)!important;
 color:#f0f5fd!important;
 -webkit-backdrop-filter:blur(10px) saturate(1.65);
 backdrop-filter:blur(10px) saturate(1.65);
 box-shadow:inset 1px 1px 1px #ffffff70,inset -1px -1px 1px #ffffff26,inset 0 0 8px #ffffff08,0 4px 15px #0002!important;
 transition:background-color .35s,border-color .35s,box-shadow .35s,translate .4s cubic-bezier(.2,.8,.2,1),scale .4s cubic-bezier(.2,.8,.2,1),padding .35s,color .25s!important;
}
html.liquid-refraction-ready body .glass-control.glass-hero{
 -webkit-backdrop-filter:blur(10px) saturate(1.65);
 backdrop-filter:url("#codeverly-liquid-refraction") blur(3px) saturate(1.5);
}
body .glass-control:is([aria-pressed="true"],[aria-selected="true"],[aria-current="step"],.active){
 background:linear-gradient(135deg,#dceaff27,#dceaff0b)!important;
 border-color:#dcecff85!important;
 box-shadow:inset 1px 1px 1px #ffffff8f,inset -1px -1px 1px #b9d8ff50,0 0 16px #a6c9ff0a!important;
}
body .glass-hover{
 --glass-inset-left:max(var(--glass-pad-left,16px),16px);
 --glass-inset-right:max(var(--glass-pad-right,16px),16px);
 overflow:hidden;
 padding-left:calc(var(--glass-inset-left) + 14px)!important;
 padding-right:var(--glass-inset-right)!important;
 min-height:40px;
 text-shadow:0 1px 6px #0003;
}
body .glass-hover::before{
 content:'';
 position:absolute;
 inset:0;
 border-radius:inherit;
 background:var(--glass-reveal);
 box-shadow:0 0 8px #e5efff50;
 clip-path:circle(3.5px at calc(var(--glass-inset-left) + 1.5px) 50%);
 transition:clip-path .48s cubic-bezier(.22,.7,.22,1),box-shadow .4s;
 z-index:1;
 pointer-events:none;
}
body .glass-hover::after{
 content:attr(data-glass-label);
 position:absolute;
 inset:0;
 display:flex;
 align-items:center;
 justify-content:center;
 padding:8px 16px;
 color:var(--glass-reveal-copy)!important;
 text-align:center;
 font:inherit;
 line-height:inherit;
 text-shadow:none;
 white-space:normal;
 clip-path:circle(0px at calc(var(--glass-inset-left) + 1.5px) 50%);
 text-indent:0;
 transition:clip-path .48s cubic-bezier(.22,.7,.22,1);
 pointer-events:none;
 z-index:2;
}
body .glass-hover>*{z-index:0}
body [data-glass-decoration]{display:none!important}
/* Decorative diagonal arrows are removed even before the enhancement script runs. */
body :is(.nav-contact,.viewer-contact,.button,.hero-work-link,.text-link,.concept-link,.back-top)>[aria-hidden="true"]{display:none!important}
body .ring-card-copy>i{display:none!important}
body .ring-card-copy{grid-template-columns:1fr}
body .film-toggle>span:first-child{display:none}
body .glass-filter-definitions{position:fixed;left:-9999px;top:-9999px;pointer-events:none;overflow:hidden}
@media(hover:hover) and (pointer:fine){
 body .glass-control:not(:disabled):not([aria-disabled="true"]):hover{
  border-color:#f0f7ffae!important;
  box-shadow:inset 1px 1px 1px #ffffffb0,inset -1px -1px 1px #d3e6ff65,0 6px 22px #0002,0 0 20px #c4dfff0e!important;
 }
 body .glass-hover:not(:disabled):not([aria-disabled="true"]):hover{
  background:linear-gradient(135deg,#ffffff15,#c2ddff0d)!important;
  text-shadow:none;
  transform:none!important;
  translate:var(--glass-pull-x,0px) var(--glass-pull-y,0px);
  scale:1.012;
 }
 body .glass-hover:not(:disabled):not([aria-disabled="true"]):hover::before{clip-path:circle(150% at calc(var(--glass-inset-left) + 1.5px) 50%);box-shadow:none}
 body .glass-hover:not(:disabled):not([aria-disabled="true"]):hover::after{clip-path:circle(150% at calc(var(--glass-inset-left) + 1.5px) 50%);text-indent:0}
}
body .glass-hover:not(:disabled):not([aria-disabled="true"]):focus-visible{
 text-shadow:none;
 outline:2px solid #d6e7ff!important;
 outline-offset:5px!important;
}
body .glass-hover:not(:disabled):not([aria-disabled="true"]):focus-visible::before{clip-path:circle(150% at calc(var(--glass-inset-left) + 1.5px) 50%)}
body .glass-hover:not(:disabled):not([aria-disabled="true"]):focus-visible::after{clip-path:circle(150% at calc(var(--glass-inset-left) + 1.5px) 50%);text-indent:0}
body .glass-control:not(:disabled):active{scale:.976}
@media(prefers-reduced-motion:reduce){
 body .glass-control,body .glass-hover::before,body .glass-hover::after,body .glass-hover>*{transition:none!important;translate:none!important;scale:1!important}
}
.motion-paused body .glass-control,.motion-paused body .glass-hover::before,.motion-paused body .glass-hover::after,.motion-paused body .glass-hover>*{transition:none!important;translate:none!important;scale:1!important}

/* The large diagonal next to the contact heading was decorative as well. */
body .contact-copy h2 svg{display:none!important}
/* Empty generated-content alternative text avoids duplicate spoken labels. */
@supports(content:"label" / ""){
 body .glass-hover::after{content:attr(data-glass-label) / ""}
}

body .food-stamp>i{display:none!important}

/* Clear glass on the pale product, booking and editorial surfaces. */
body :is(.product-realism,.demo-window,.demo-booking,.cinema-concept[data-cinema-style="minimal"],.cinema-concept[data-cinema-style="editorial"]) .glass-control{
 --glass-reveal:#1b2e47;
 --glass-reveal-copy:#f2f7ff;
 background:radial-gradient(ellipse at var(--glass-x,50%) var(--glass-y,0%),#ffffff88,transparent 68%),linear-gradient(135deg,#ffffff4d,#54749c14)!important;
 color:#1c3049!important;
 border-color:#49617a70!important;
 box-shadow:inset 1px 1px 1px #ffffffb0,inset -1px -1px 1px #243d6440,0 4px 15px #14253a15!important;
}
body :is(.product-realism,.demo-window,.demo-booking,.cinema-concept[data-cinema-style="minimal"],.cinema-concept[data-cinema-style="editorial"]) .glass-control>span{color:inherit!important}

/* Measure responsive padding without sampling an in-progress padding transition. */
body .glass-control[data-glass-measuring]{transition:none!important}

body .glass-hover svg[data-icon="arrow"]{display:none!important}

/* Native selectors also need room inside their rounded outline. */
body :is(#contact-budget,#demo-tour){padding-left:16px!important;padding-right:30px!important;min-height:44px;box-sizing:border-box}
body #demo-tour{font-size:clamp(14px,2.4vw,20px);line-height:1.4}

/* Compact selectors keep one readable label and wrap instead of clipping. */
body :is(.academy-lesson-tabs,.cinema-treatments,.product-demo-tabs)>button{padding:10px 14px!important;min-height:40px;line-height:1.4;white-space:normal}
body .academy-lesson-tabs{flex-wrap:wrap;gap:8px}
body .cinema-treatments{flex-wrap:wrap;max-width:100%}
body .cinema-toolbar{flex-wrap:wrap}
body .product-demo-tabs{flex-wrap:wrap;overflow:visible;box-sizing:border-box}

body .food-scene-controls>button{padding:9px 10px!important;min-height:40px;justify-content:center}
/* Long dialogs retain an opaque close row while their body scrolls. */
body :is(.market-dialog-bar,.sd-dialog-top,.cl-screen-header){position:sticky;top:0;z-index:20}
body .market-dialog-bar{background:#152030}
body .sd-dialog-top{background:#13271f}
body .cl-screen-header{background:#0d2025}
body :is(.food-builder-bottom>strong,.food-total strong,.sd-price-total strong,.market-cart-total strong,.market-detail-price>strong,.cart-total strong){white-space:nowrap}
