/* Barlow (SIL Open Font License 1.1) – hosted locally, no requests to Google Fonts */
@font-face{font-family:'Barlow';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/barlow-italic-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/barlow-italic-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow';font-style:italic;font-weight:600;font-display:swap;src:url(fonts/barlow-italic-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:italic;font-weight:600;font-display:swap;src:url(fonts/barlow-italic-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:300;font-display:swap;src:url(fonts/barlow-normal-300-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-weight:300;font-display:swap;src:url(fonts/barlow-normal-300-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/barlow-normal-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/barlow-normal-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-normal-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-normal-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-normal-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-normal-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-normal-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-normal-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Supertechno 2026 – prototype styles. Brand: Technocrane Design Manual rev.01 */
:root{
  --deep-steel:#33465A; --steel:#93A7B0; --signal:#FFE81A; --carbon:#141618;
  --s50:#F4F6F7; --s100:#E8ECEE; --s200:#D5DDE1; --s300:#B9C6CC; --s600:#5C6F7D;
  --bg:#fff; --surface:var(--s50); --text:#1b2127; --heading:var(--deep-steel); --muted:var(--s600);
  --line:var(--s200); --card:#fff; --accent:var(--deep-steel); --on-accent:#fff;
  --font:'Barlow',Helvetica,Arial,sans-serif; --max:1240px; --r:3px; --ease:cubic-bezier(.2,.7,.2,1);
  --shadow:0 1px 2px rgba(20,22,24,.06),0 8px 24px -12px rgba(20,22,24,.18);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#141618; --surface:#1b1e21; --text:#e6ebee; --heading:#fff; --muted:#93A7B0; --line:#2c3237; --card:#1b1e21;
  --accent:#93A7B0; --on-accent:#141618; --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -12px rgba(0,0,0,.6); color-scheme:dark}}
:root[data-theme=dark]{
  --bg:#141618; --surface:#1b1e21; --text:#e6ebee; --heading:#fff; --muted:#93A7B0; --line:#2c3237; --card:#1b1e21;
  --accent:#93A7B0; --on-accent:#141618; --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -12px rgba(0,0,0,.6); color-scheme:dark}

*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font:400 17px/1.55 var(--font);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block} a{color:inherit}
h1,h2,h3,h4{font-weight:600;line-height:1.1;color:var(--heading);margin:0;letter-spacing:-.01em}
h1{font-size:clamp(2.2rem,5vw,3.6rem);font-weight:600} h2{font-size:clamp(1.5rem,3vw,2rem)} h3{font-size:1.15rem}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px} .narrow{max-width:800px}
.muted{color:var(--muted)} .small{font-size:.85rem} .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:8px;top:8px;transform:translateY(-200%);background:var(--signal);color:#000;padding:8px 14px;z-index:99} .skip:focus{transform:none}
:focus-visible{outline:3px solid var(--signal);outline-offset:2px;box-shadow:0 0 0 5px var(--carbon)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:32px;height:68px}
.brand img{height:24px;width:auto}.logo-dark{display:none}
:root[data-theme=dark] .logo-light{display:none}:root[data-theme=dark] .logo-dark{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .logo-light{display:none}:root:not([data-theme=light]) .logo-dark{display:block}}
.main-nav{display:flex;gap:4px;flex:1}
.main-nav a{padding:8px 12px;text-decoration:none;font-weight:500;font-size:.95rem;position:relative;color:var(--text)}
.main-nav a:hover{color:var(--heading)}
.main-nav a[aria-current]::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:3px;background:var(--signal);transform:skewX(-14deg)}
.main-nav .ext{color:var(--muted)}
.bar-end{display:flex;align-items:center;gap:10px}
.icon-btn{background:none;border:1px solid var(--line);border-radius:var(--r);width:38px;height:38px;display:grid;place-items:center;color:var(--text);cursor:pointer}
.icon-btn:hover{border-color:var(--accent)} .menu-btn{display:none}

/* buttons */
.btn{display:inline-block;background:var(--accent);color:var(--on-accent);border:0;border-radius:var(--r);padding:13px 22px;font:600 .95rem var(--font);text-decoration:none;cursor:pointer;transition:transform .15s var(--ease),background .15s}
.btn:hover{transform:translateY(-1px)} .btn-sm{padding:9px 16px;font-size:.88rem}
.btn-signal{background:var(--signal);color:#141618} .btn-signal:hover{background:#fff}
.btn-ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 1.5px currentColor}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 1.2em}
.chip{display:inline-flex;gap:6px;align-items:center;padding:7px 14px;border:1px solid var(--line);border-radius:99px;background:var(--card);font:500 .88rem var(--font);color:var(--text);text-decoration:none;cursor:pointer}
.chip:hover{border-color:var(--accent)} .chip.on{background:var(--accent);color:var(--on-accent);border-color:var(--accent)} .chip em{font-style:normal;opacity:.6;font-size:.8rem} .chip.static{cursor:default;border-radius:var(--r)}

/* slant motif */
.slant{display:inline-block;width:.42em;height:.9em;margin-right:.45em;background:var(--signal);transform:skewX(-14deg) translateY(.08em)}
.eyebrow{font-weight:600;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--steel);margin-bottom:1.2rem}

/* hero */
.hero{background:var(--carbon);color:#fff;position:relative;overflow:hidden}
.hero h1{color:#fff} .hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:stretch;min-height:540px}
.hero-copy{padding:88px 0 72px;align-self:center}
.lead{font-size:1.2rem;color:#c8d2d8;max-width:34em;margin:1.4rem 0 2rem}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.hero .btn-ghost{color:#fff}
.hero-media{position:relative;margin-right:calc((100vw - min(100vw,var(--max)))/-2 - 24px)}
.hero-media::before{content:"";position:absolute;left:-22px;top:0;bottom:0;width:14px;background:var(--signal);transform:skewX(-14deg);z-index:2}
.hero-media img{width:100%;height:100%;object-fit:cover;clip-path:polygon(9% 0,100% 0,100% 100%,0 100%);filter:saturate(.95)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #2c3237;position:relative;z-index:3}
.stats div{padding:22px 0;display:flex;flex-direction:column}.stats b{font-size:2rem;font-weight:600;color:#fff;line-height:1}.stats span{color:var(--steel);font-size:.85rem;letter-spacing:.05em;text-transform:uppercase;margin-top:6px}

/* sections */
.section{padding:72px 0}.section.tight{padding:40px 0 72px}.section.alt{background:var(--surface)}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:28px;gap:16px}
.more{font-weight:600;text-decoration:none;color:var(--heading)} .more:hover{text-decoration:underline;text-underline-offset:4px}
.page-head{padding:40px 0 20px;border-bottom:1px solid var(--line);background:var(--surface)}
.page-head h1{font-size:clamp(2rem,4vw,3rem)}
.crumbs{font-size:.85rem;color:var(--muted);margin-bottom:14px}.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}
.lead-sm{font-size:1.1rem;color:var(--muted);margin-top:.6rem}
.page-head .chips{margin-top:18px}

/* cards */
.cat-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cat-tile{background:var(--card);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;overflow:hidden;transition:box-shadow .2s,transform .2s var(--ease)}
.cat-tile:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.cat-imgs{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;height:230px;gap:2px;background:var(--line)}
.cat-imgs img{width:100%;height:100%;object-fit:cover}.cat-imgs img:first-child{grid-row:span 2}
.cat-meta{padding:18px 20px 22px}.cat-meta p{margin:6px 0 0;color:var(--muted);font-size:.92rem}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.pcard{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;overflow:hidden;transition:box-shadow .2s,transform .2s var(--ease)}
.pcard:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.pcard-img{aspect-ratio:4/3;background:var(--s100);overflow:hidden}.pcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}.pcard:hover img{transform:scale(1.04)}
.pcard-body{padding:16px 18px 20px;border-top:3px solid var(--signal)}.pcard-body p{margin:4px 0 0;color:var(--muted);font-size:.9rem}
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.doc-stack{display:grid;gap:12px}
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}
.ncard{text-decoration:none;display:block}.ncard-img{aspect-ratio:16/9;background:var(--s100);overflow:hidden;border-radius:var(--r);display:grid;place-items:center}
.ncard-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}.ncard:hover img{transform:scale(1.04)}
.ncard-body{padding-top:12px}.ncard time,.page-head time{font-size:.82rem;color:var(--muted);letter-spacing:.04em}.ncard h3{margin-top:4px}.ncard:hover h3{text-decoration:underline;text-underline-offset:3px}
.cta-band{background:var(--deep-steel);color:#fff;padding:56px 0}.cta-band h2{color:#fff}.band{display:flex;align-items:center;justify-content:space-between;gap:32px}.band p{margin:.5em 0 0;color:#cfd9de}

/* product page */
.product-head{padding-bottom:0;background:var(--surface)}
.ph-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding-bottom:32px}
.ph-img{aspect-ratio:4/3;overflow:hidden;border-radius:var(--r);background:var(--s100)}.ph-img img{width:100%;height:100%;object-fit:cover}
.product-head .cta-row{margin-top:26px}.product-head .btn-ghost{color:var(--heading)}
.subnav{display:flex;gap:24px;border-top:1px solid var(--line);margin-top:8px}
.subnav a{padding:14px 0;text-decoration:none;font-weight:500;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px}.subnav a:hover{color:var(--heading);border-color:var(--signal)}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.gallery a{aspect-ratio:4/3;overflow:hidden;border-radius:var(--r);background:var(--s100)}.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}.gallery a:hover img{transform:scale(1.06)}
.dl-group{margin-bottom:40px}.dl-group h3{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.dl-group h3 span{font-size:.75rem;font-weight:600;background:var(--accent);color:var(--on-accent);border-radius:99px;padding:2px 9px}
.dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}.dgrid.wide{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}
.doc{display:flex;gap:16px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px;text-decoration:none;transition:border-color .15s,box-shadow .2s}
.doc:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.doc-thumb{flex:0 0 74px;height:100px;background:var(--s100);border-radius:2px;overflow:hidden;display:grid;place-items:center}.doc-thumb img{width:100%;height:100%;object-fit:cover}
.doc-ph{font:700 .8rem var(--font);letter-spacing:.1em;color:var(--s600)}
.doc-body{display:flex;flex-direction:column;gap:3px;min-width:0}.doc-body strong{font-weight:600;color:var(--heading);line-height:1.25}.doc-body small{color:var(--muted);font-size:.8rem}
.tag{font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.dl{margin-top:auto;padding-top:6px;font-size:.82rem;font-weight:600;color:var(--accent);display:inline-flex;gap:6px;align-items:center}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.video{position:relative;aspect-ratio:16/9;border:0;padding:0;background:#000;border-radius:var(--r);overflow:hidden;cursor:pointer;display:block;width:100%}
.video img{width:100%;height:100%;object-fit:cover;opacity:.85;transition:opacity .2s}.video:hover img{opacity:1}
.video iframe{width:100%;height:100%;border:0;position:absolute;inset:0}
.play{position:absolute;left:50%;top:50%;width:64px;height:44px;margin:-22px 0 0 -32px;background:var(--signal);transform:skewX(-14deg);border-radius:4px}
.play::after{content:"";position:absolute;left:50%;top:50%;margin:-9px 0 0 -6px;border:9px solid transparent;border-left:14px solid #141618;transform:skewX(14deg)}

/* library + rental */
.lib{display:grid;grid-template-columns:260px 1fr;gap:40px;align-items:start}
.filters{position:sticky;top:90px}.filters h4{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:24px 0 8px}
.search input,.rental-bar select{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--text);font:inherit}
.radio-list{display:flex;flex-direction:column;gap:2px}.radio-list label{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:.95rem;cursor:pointer}.radio-list em{margin-left:auto;font-style:normal;color:var(--muted);font-size:.8rem}
.radio-list .grp{font-size:.75rem;color:var(--muted);margin:10px 0 2px;font-weight:600}
.radio-list input{accent-color:var(--deep-steel)}
.count{color:var(--muted);font-size:.9rem;margin-bottom:14px}.empty{padding:40px 0;color:var(--muted)}
.rental-bar{display:grid;grid-template-columns:1fr 220px;gap:12px;padding-top:24px}.rental-bar .chips{grid-column:1/-1;margin:0}
.rental-grid{display:grid;grid-template-columns:420px 1fr;gap:24px;padding-top:12px;padding-bottom:56px;align-items:start}
.rlist{max-height:640px;overflow:auto;padding-right:6px}
.rcard{display:block;width:100%;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:10px;cursor:pointer;font:inherit;color:inherit;text-decoration:none}
.rcard:hover,.rcard.on{border-color:var(--accent);box-shadow:var(--shadow)}.rcard strong{display:block;color:var(--heading);font-weight:600}.rcard span{color:var(--muted);font-size:.9rem}
.rcard .eq{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}.rcard .eq i{font-style:normal;font-size:.72rem;font-weight:600;border:1px solid var(--line);padding:1px 7px;border-radius:2px;color:var(--muted)}
.rcard .go{float:right;font-size:.8rem;font-weight:600;color:var(--accent)}
.rmap{position:sticky;top:90px}#map{height:640px;border-radius:var(--r);border:1px solid var(--line);background:var(--s100);z-index:1}
.partner{display:grid;grid-template-columns:1fr 1fr;gap:40px}.partner #map{height:380px}
.facts{margin:0;display:grid;gap:18px;align-content:start}.facts dt{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.facts dd{margin:2px 0 0;font-size:1.05rem}.facts a{color:var(--heading)}

/* misc */
.prose{font-size:1.08rem}.prose h3{margin:1.4em 0 .4em}.prose img{border-radius:var(--r);margin:1em 0;height:auto}.prose a{color:var(--heading)}
blockquote{margin:1.5em 0;padding:4px 0 4px 22px;border-left:4px solid var(--signal);font-size:1.25rem;color:var(--heading)}cite{display:block;font-size:.9rem;color:var(--muted);margin-top:8px;font-style:normal}
.prose .video{max-width:640px;margin:1em 0}
.modal{border:0;border-radius:var(--r);padding:0;width:min(560px,94vw);background:var(--bg);color:var(--text);box-shadow:0 30px 80px rgba(0,0,0,.4)}.modal::backdrop{background:rgba(20,22,24,.65);backdrop-filter:blur(3px)}
.inq{padding:32px;display:grid;gap:14px;position:relative}.inq.flat{padding:0}.inq label{display:grid;gap:5px;font-size:.88rem;font-weight:500}
.inq input:not([type=checkbox]),.inq textarea{padding:11px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--text);font:inherit}
.inq .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.inq .check{display:flex;gap:8px;align-items:flex-start;font-weight:400}.x{position:absolute;right:14px;top:10px;border:0;background:none;font-size:1.8rem;cursor:pointer;color:var(--muted)}
.lightbox{position:fixed;inset:0;background:rgba(10,12,14,.92);z-index:100;display:grid;place-items:center;cursor:zoom-out}.lightbox img{max-width:92vw;max-height:90vh}
.site-footer{background:var(--carbon);color:#c8d2d8;padding:56px 0 24px;margin-top:0}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}.foot-grid h4{color:#fff;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}
.foot-grid a{display:block;text-decoration:none;padding:3px 0;color:#c8d2d8}.foot-grid a:hover{color:#fff;text-decoration:underline}.foot-addr{margin-top:18px;font-size:.95rem}
.foot-base{display:flex;justify-content:space-between;border-top:1px solid #2c3237;margin-top:40px;padding-top:20px;font-size:.85rem;color:var(--steel)}.foot-base a{color:var(--steel)}

@media (max-width:960px){
  .hero-grid,.ph-grid,.split,.partner,.lib,.rental-grid{grid-template-columns:1fr}
  .hero-media{height:280px;margin:0 -24px}.hero-media::before{display:none}.hero-media img{clip-path:none}.hero-copy{padding:56px 0 32px}
  .stats{grid-template-columns:repeat(2,1fr);gap:0 24px}.cat-tiles{grid-template-columns:1fr}
  .main-nav{display:none;position:absolute;top:68px;left:0;right:0;flex-direction:column;background:var(--bg);padding:12px 24px 20px;border-bottom:1px solid var(--line)}
  .main-nav.open{display:flex}.menu-btn{display:grid}.bar{gap:12px}.bar .brand{margin-right:auto}.bar-end .btn{display:none}
  .filters{position:static}.rmap{position:static}#map{height:380px}.rlist{max-height:none}.band{flex-direction:column;align-items:flex-start}
  .foot-grid{grid-template-columns:1fr 1fr}.foot-base{flex-direction:column;gap:6px}.section{padding:52px 0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* exhibitions / contact / legal */
.split.top{align-items:start}
.exgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px}
.excard{display:flex;gap:0;background:var(--card);border:1px solid var(--line);border-radius:var(--r);text-decoration:none;overflow:hidden;transition:box-shadow .2s,transform .2s var(--ease)}
.excard:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.ex-logo{flex:0 0 150px;background:#fff;display:grid;place-items:center;padding:18px;border-right:3px solid var(--signal)}.ex-logo img{max-height:70px;width:auto;object-fit:contain}
.ex-body{padding:18px 20px;display:flex;flex-direction:column;gap:2px}.ex-body time{font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.ex-body p{margin:0;color:var(--muted)}
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}
.person{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:2px;align-items:flex-start}
.person-photo{width:96px;height:96px;border-radius:50%;overflow:hidden;background:var(--s100);display:grid;place-items:center;margin-bottom:12px;font-weight:600;color:var(--s600);font-size:1.4rem;box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--signal)}
.person-photo img{width:100%;height:100%;object-fit:cover}
.person h3{margin-top:4px}.person .role{color:var(--muted);margin:0 0 8px;font-size:.95rem}.person a:not(.btn){font-size:.95rem;text-decoration:none;color:var(--text)}.person a:not(.btn):hover{text-decoration:underline}
.person .btn{margin-top:14px;display:inline-flex;gap:8px;align-items:center;color:var(--heading)}
.legal{font-size:1rem}.legal ol,.legal ul{padding-left:1.4em}.legal li{margin-bottom:.8em}.legal h3,.legal h4{margin-top:1.6em}
@media (max-width:640px){.excard{flex-direction:column}.ex-logo{flex-basis:auto;border-right:0;border-bottom:3px solid var(--signal);padding:22px}}

/* download cards with covers (product pages) */
.dgrid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px}
.doc{flex-direction:column;gap:0;padding:0;overflow:hidden}
.doc-thumb{flex:none;width:100%;height:auto;aspect-ratio:4/3;border-radius:0;background:var(--s100);border-bottom:1px solid var(--line);padding:12px}
.doc-thumb{position:relative;display:block}
.doc-thumb img{position:absolute;inset:12px;width:calc(100% - 24px);height:calc(100% - 24px);object-fit:contain;filter:drop-shadow(0 2px 6px rgba(20,22,24,.18));transition:transform .35s var(--ease)}
.doc-thumb .doc-ph{position:absolute;inset:0;display:grid;place-items:center}
.doc:hover .doc-thumb img{transform:scale(1.04)}
.doc-body{padding:14px 16px 16px;flex:1}
.stats{grid-template-columns:repeat(3,1fr)}

/* ---- homepage slider (replaces static hero) ---- */
.vslider{position:relative;background:var(--carbon);color:#fff;overflow:hidden;height:clamp(560px,84vh,800px)}
.vs-track{display:flex;height:100%;transition:transform 1s var(--ease);will-change:transform}
.vs-slide{flex:0 0 100%;position:relative;background-size:cover;background-position:center;display:flex;align-items:center}
.vs-slide::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,22,24,.82) 0%,rgba(20,22,24,.45) 45%,rgba(20,22,24,0) 75%),linear-gradient(0deg,rgba(20,22,24,.85) 0%,rgba(20,22,24,0) 38%)}
.vs-copy{position:relative;width:100%;padding-bottom:120px}
.vs-title{color:#fff;font-size:clamp(2.6rem,6.4vw,5rem);font-weight:600;letter-spacing:-.02em;max-width:12em;position:relative;padding-left:.34em}
.vs-title::before{content:"";position:absolute;left:0;top:.12em;bottom:.12em;width:.12em;background:var(--signal);transform:skewX(-14deg)}
.vs-sub{font-size:clamp(1.1rem,2vw,1.5rem);color:#e3eaee;margin:1.1rem 0 0;max-width:24em;line-height:1.35}
.vs-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:2rem}
.vs-play{display:inline-flex;align-items:center;gap:14px;background:none;border:0;color:#fff;font:500 .95rem var(--font);cursor:pointer;padding:6px 0;text-align:left}
.vs-play .play{position:relative;flex:none;left:auto;top:auto;margin:0;width:52px;height:38px;transition:transform .2s var(--ease)}
.vs-play:hover .play{transform:skewX(-14deg) scale(1.08)}
.vs-play small{display:block;color:#aebdc5;font-size:.8rem}
.vs-arrow{position:absolute;top:calc(50% - 60px);z-index:3;width:48px;height:56px;border:0;background:rgba(20,22,24,.55);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .2s}
.vs-arrow:hover{background:var(--signal);color:#141618}.vs-prev{left:0}.vs-next{right:0}
.vs-pause{position:absolute;right:16px;bottom:112px;z-index:3;width:36px;height:36px;border:1px solid rgba(255,255,255,.35);background:rgba(20,22,24,.55);color:#fff;border-radius:50%;display:grid;place-items:center;cursor:pointer}
.vs-pause:hover{border-color:var(--signal)}.vs-pause[aria-pressed=true] path{d:path("M8 5v14l11-7z")}
.vs-tabs{position:absolute;left:0;right:0;bottom:0;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:0 24px;border-top:1px solid rgba(255,255,255,.18);background:linear-gradient(0deg,rgba(20,22,24,.9),rgba(20,22,24,.55))}
.vs-tab{position:relative;display:flex;gap:14px;align-items:flex-start;text-align:left;padding:20px 18px 22px 0;margin-right:18px;background:none;border:0;color:#9fb0b8;cursor:pointer;font:inherit}
.vs-tab:hover,.vs-tab.is-active{color:#fff}
.vs-num{font:600 1.5rem/1 var(--font);color:var(--steel)}.vs-tab.is-active .vs-num{color:var(--signal)}
.vs-tt b{display:block;font-weight:600;font-size:1.02rem}.vs-tt em{display:block;font-style:normal;font-size:.82rem;line-height:1.3;margin-top:3px;color:#8ea1aa;max-width:20em}
.vs-bar{position:absolute;left:0;right:18px;top:-1px;height:3px;background:transparent;overflow:hidden}
.vs-bar::after{content:"";position:absolute;inset:0;background:var(--signal);transform:scaleX(0);transform-origin:left}
.vs-tab.is-active .vs-bar::after{transform:scaleX(1)}
.vslider.playing .vs-tab.is-active .vs-bar::after{transform:scaleX(0);animation:vsfill var(--vs-time,10s) linear forwards}
@keyframes vsfill{to{transform:scaleX(1)}}
.modal-video{width:min(980px,94vw);background:#000;padding:0}.modal-video .x{color:#fff;z-index:2;top:6px;right:10px}
.vm-body{aspect-ratio:16/9;width:100%}.vm-body iframe{width:100%;height:100%;border:0;display:block}
@media (max-width:960px){
  .vslider{height:clamp(560px,86vh,720px)}
  .vs-arrow{display:none}.vs-tabs{grid-template-columns:repeat(4,1fr);padding:0 12px}
  .vs-tab{flex-direction:column;gap:6px;padding:14px 8px 16px 0;margin-right:8px}.vs-tt em{display:none}.vs-tt b{font-size:.82rem;line-height:1.2}.vs-num{font-size:1.1rem}
  .vs-copy{padding-bottom:110px}.vs-pause{bottom:100px}
}
.ncard .ex{margin:.4em 0 0;color:var(--muted);font-size:.92rem;line-height:1.4}.prose .vgrid.tv{margin:1.4em 0}
.vs-tabs{max-width:none;padding-left:max(24px,calc((100% - var(--max))/2 + 24px));padding-right:max(24px,calc((100% - var(--max))/2 + 24px))}@media (max-width:960px){.vs-tabs{padding-left:12px;padding-right:12px}}
.person-photo{width:112px;height:112px}

/* contact page: compact map level with the address block */
.contact-map{position:static}
.contact-map #map{height:240px}
.split.top:has(.contact-map){align-items:start}
.split.top:has(.contact-map) .prose{padding-top:0}
.split.top:has(.contact-map) .prose h3{margin-top:0}
@media (max-width:960px){.contact-map #map{height:220px}}

/* news cards: preview is a player; title link covers the rest of the card */
.ncard{position:relative}
.ncard-img{position:relative}
.ncard-img .video{height:100%;border-radius:0}
.ncard-img>a{display:block;width:100%;height:100%;display:grid;place-items:center}
.ncard h3 a{text-decoration:none;color:inherit}
.ncard h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.ncard-img .video{position:relative;z-index:2}
.ncard:hover h3 a{text-decoration:underline;text-underline-offset:3px}
.ncard-img .play{width:56px;height:40px;margin:-20px 0 0 -28px}
.video.playing{cursor:default}
.doc .upd{font-size:.78rem;color:var(--muted);margin-top:2px}.doc .upd::before{content:"";display:inline-block;width:.5em;height:.5em;background:var(--signal);transform:skewX(-14deg);margin-right:.5em}

/* ---- news artwork cover (no photo, no video): design manual – carbon/deep steel, slanted bars, yellow stadium frame, Barlow italic */
.ncard-img{container-type:inline-size}
.ncard-art{position:relative;width:100%;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#fff;
  background:linear-gradient(135deg,#141618 0%,#1d2733 55%,#33465A 135%);--bx:56%;--bw:20%}
.ncard-art.v1{--bx:14%;--bw:26%;background:linear-gradient(120deg,#33465A 0%,#1b2530 60%,#141618 120%)}
.ncard-art.v2{--bx:70%;--bw:14%;background:linear-gradient(150deg,#141618 0%,#243241 70%,#33465A 140%)}
.ncard-art::before{content:"";position:absolute;top:-12%;bottom:-12%;left:var(--bx);width:var(--bw);transform:skewX(-14deg);background:linear-gradient(180deg,rgba(147,167,176,.26),rgba(147,167,176,.05))}
.ncard-art::after{content:"";position:absolute;top:-12%;bottom:-12%;left:calc(var(--bx) - 3.2%);width:1.1%;transform:skewX(-14deg);background:var(--signal)}
.art-frame{position:relative;z-index:1;border:max(2px,.9cqw) solid var(--signal);border-radius:999px;padding:.5em 1.5em .52em;transform:skewX(-14deg);background:rgba(20,22,24,.35)}
.art-frame b{display:block;transform:skewX(14deg);font:italic 600 clamp(14px,7.4cqw,40px)/1 var(--font);letter-spacing:.015em;white-space:nowrap}
.ncard-art small{position:absolute;left:5cqw;bottom:5cqw;z-index:1;font:600 clamp(9px,2.7cqw,12px)/1 var(--font);letter-spacing:.16em;color:var(--steel);text-transform:uppercase}

/* home: product category tiles show whole photos (no cropping) */
.cat-imgs img{object-fit:contain !important;background:#fff;padding:6px}

.rental-bar{grid-template-columns:1fr 280px}.rental-bar select{height:100%;font-weight:500;cursor:pointer}
@media (max-width:700px){.rental-bar{grid-template-columns:1fr}}

.rmulti{grid-column:1/-1;margin:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.92rem;color:var(--muted)}.rmulti[hidden]{display:none}

/* ---- photo gallery viewer (crane + head pages) ---- */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(10,12,14,.95);display:flex;flex-direction:column;cursor:default;padding:0}
.lightbox .lb-stage{flex:1;min-height:0;margin:0;display:grid;place-items:center;padding:56px 72px 8px;cursor:zoom-out}
.lightbox .lb-img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transition:opacity .2s;background:#fff;box-shadow:0 10px 50px rgba(0,0,0,.5)}
.lightbox .lb-img.loading{opacity:.35}
.lb-x{position:absolute;top:10px;right:14px;z-index:2;width:44px;height:44px;border:0;background:none;color:#fff;font-size:2.2rem;line-height:1;cursor:pointer}
.lb-count{position:absolute;top:18px;left:22px;z-index:2;color:#c8d2d8;font:600 .9rem var(--font);letter-spacing:.08em}
.lb-nav{position:absolute;top:50%;z-index:2;transform:translateY(-70%);width:52px;height:72px;border:0;background:rgba(20,22,24,.6);color:#fff;font-size:2.6rem;line-height:1;cursor:pointer;transition:background .15s}
.lb-nav:hover,.lb-x:hover{background:var(--signal);color:#141618}
.lb-prev{left:10px}.lb-next{right:10px}
.lb-thumbs{display:flex;gap:6px;overflow-x:auto;padding:10px 16px 14px;justify-content:center;scrollbar-width:thin}
.lb-thumbs button{flex:none;width:76px;height:56px;padding:0;border:2px solid transparent;border-radius:2px;background:#fff;opacity:.55;cursor:pointer;overflow:hidden;transition:opacity .15s}
.lb-thumbs button:hover,.lb-thumbs button[aria-current=true]{opacity:1}
.lb-thumbs button[aria-current=true]{border-color:var(--signal)}
.lightbox .lb-thumbs img{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;box-shadow:none;background:none;display:block}
.ph-img.zoomable{cursor:zoom-in}
.gallery a{cursor:zoom-in}
@media (max-width:700px){.lightbox .lb-stage{padding:52px 8px 6px}.lb-nav{width:40px;height:56px;font-size:2rem}.lb-prev{left:2px}.lb-next{right:2px}.lb-thumbs button{width:60px;height:46px}}

/* ---- Academy page (from the approved mockup, in the new design system) ---- */
.ac-hero{position:relative;background:var(--carbon);color:#fff;overflow:hidden;min-height:clamp(420px,62vh,620px);display:flex;align-items:center;background-image:url(academy/technocrane-academy-hero-poster.jpg);background-size:cover;background-position:center}
.ac-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.6}
.ac-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,22,24,.88) 0%,rgba(20,22,24,.55) 55%,rgba(20,22,24,.2) 100%)}
.ac-hero-in{position:relative;z-index:1;padding-block:56px}
.ac-hero h1{color:#fff;font-size:clamp(2.4rem,5.4vw,4.2rem);max-width:12em;position:relative;padding-left:.34em}
.ac-hero h1::before{content:"";position:absolute;left:0;top:.12em;bottom:.12em;width:.1em;background:var(--signal);transform:skewX(-14deg)}
.ac-hero .lead{max-width:36em}
.crumbs.light{color:#9fb0b8}.crumbs.light a{color:#c8d2d8}
.price-tag{display:inline-flex;align-items:baseline;gap:8px;font-size:1rem;color:#c8d2d8;margin-left:8px}.price-tag strong{font-size:1.9rem;color:#fff;font-weight:600}
.facts{background:var(--surface);border-bottom:1px solid var(--line)}
.facts dl{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:0}
.facts dl>div{padding:22px 18px 22px 0;margin-right:18px;border-right:1px solid var(--line)}.facts dl>div:last-child{border-right:0}
.facts dt{font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.facts dd{margin:4px 0 0;font-weight:500;color:var(--heading)}
.sec-title{text-align:center;max-width:46em;margin:0 auto 44px}.sec-title p{color:var(--muted);margin:.8em 0 0}
.sec-title h2::after{content:"";display:block;width:46px;height:5px;background:var(--signal);transform:skewX(-14deg);margin:16px auto 0}
.day{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:start}
.day h3{margin:1.6em 0 .7em}
.topics{list-style:none;padding:0;margin:0 0 1.8em;display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.topics li{padding:10px 0 10px 22px;border-bottom:1px solid var(--line);position:relative;font-size:.98rem}
.topics li::before{content:"";position:absolute;left:2px;top:1.05em;width:7px;height:.8em;background:var(--signal);transform:skewX(-14deg)}
.schedule{margin:0 0 .8em}.schedule>div{display:grid;grid-template-columns:76px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.schedule dt{font-weight:600;color:var(--heading);font-variant-numeric:tabular-nums}.schedule dd{margin:0}
.ac-media{margin:0;position:sticky;top:96px}.ac-media .media{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--r);overflow:hidden}
.ac-media img,.ac-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ac-media figcaption{font-size:.85rem;color:var(--muted);margin-top:10px}
.vid-toggle{position:absolute;right:10px;bottom:10px;z-index:2;background:rgba(20,22,24,.7);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:6px 14px;font:600 .8rem var(--font);cursor:pointer}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.steps li{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px 22px 26px;position:relative}
.steps .n{display:block;font:italic 600 2rem/1 var(--font);color:var(--accent);margin-bottom:14px}.steps li::before{content:"";position:absolute;left:0;top:0;width:44px;height:4px;background:var(--signal)}
.steps h3{margin-bottom:.5em}.steps p{margin:0;color:var(--muted);font-size:.95rem}
.enquiry{display:grid;grid-template-columns:1fr 360px;gap:40px;align-items:start}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}.form-grid .full{grid-column:1/-1}
.academy .inq label{display:grid;gap:6px;font-size:.88rem;font-weight:500;align-content:start}.academy .inq select{padding:11px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--text);font:inherit}
.req{color:#d6453d}.hint{font-size:.8rem;color:var(--muted);font-weight:400}.consent{font-size:.9rem;margin:18px 0}
.err{color:#d6453d;font-size:.82rem}.academy [aria-invalid=true]{border-color:#d6453d}
.sent{margin-top:16px;padding:16px 18px;border-left:4px solid var(--signal);background:var(--surface)}.sent strong{display:block}
.side{display:grid;gap:16px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.card h3{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.price{font-size:2rem;font-weight:600;color:var(--heading)}.price small{font-size:.9rem;font-weight:400;color:var(--muted)}
.ticks{list-style:none;padding:0;margin:12px 0 0}.ticks li{padding:4px 0 4px 20px;position:relative}.ticks li::before{content:"";position:absolute;left:0;top:.75em;width:6px;height:.7em;background:var(--signal);transform:skewX(-14deg)}
.person-row{display:flex;gap:16px;align-items:center}.person-row img{width:84px;height:84px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--signal)}
.person-row h4{font-size:1.1rem}.person-row p{margin:0 0 8px;color:var(--muted)}
.copy{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.copy code{font:500 .9rem var(--font)}.copy button{border:1px solid var(--line);background:none;color:var(--text);border-radius:var(--r);padding:3px 10px;font:600 .75rem var(--font);cursor:pointer}
.card .contact-map #map{height:200px}.venue-link{margin:10px 0}.venue-link a{font-weight:600}.card address{font-style:normal;font-size:.95rem}
@media (max-width:960px){.facts dl{grid-template-columns:1fr 1fr}.facts dl>div{border-right:0;border-bottom:1px solid var(--line)}.day,.enquiry{grid-template-columns:1fr}.steps{grid-template-columns:1fr 1fr}.ac-media{position:static}.topics{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}}
@media (max-width:560px){.steps{grid-template-columns:1fr}.ac-hero-in{padding-block:36px}.price-tag{margin-left:0;width:100%}}

.ac-hero-in{width:100%}.academy .inq .lt{display:block}

.ph-grid.solo{grid-template-columns:1fr}

/* ---- Rental partner card (pop-up on /rental and the full partner page) ---- */
.modal-partner{width:min(780px,94vw);max-height:92vh;overflow:auto;border-radius:10px}
.modal-partner .x{position:absolute;top:10px;right:14px;z-index:3;color:#fff;background:rgba(255,255,255,.12);border-radius:50%;width:36px;height:36px;font-size:1.4rem;line-height:1}
.modal-partner .x:hover{background:rgba(255,255,255,.25)}
.ptcard{background:var(--card);color:var(--text)}
.pc-head{position:relative;background:var(--deep-steel);color:#fff;padding:30px 64px 26px 34px;overflow:hidden}
.pc-head::before{content:"";position:absolute;left:-14px;top:0;bottom:0;width:22px;background:var(--signal);transform:skewX(-14deg)}
.pc-head::after{content:"";position:absolute;right:-60px;top:-40px;width:200px;height:200px;background:rgba(255,255,255,.05);transform:skewX(-14deg)}
:root[data-theme=dark] .pc-head{background:#222a31}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .pc-head{background:#222a31}}
.pc-eyebrow{margin:0 0 6px;font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--signal)}
.pc-head h2{margin:0;font-size:clamp(1.4rem,3.4vw,2rem);line-height:1.15;font-weight:700;color:#fff;position:relative;z-index:1}
.pc-city{margin:6px 0 0;color:#cfd8de;font-size:1rem;position:relative;z-index:1}
.pc-body{padding:8px 34px 10px;display:grid;gap:0}
.pc-row{display:grid;grid-template-columns:28px 1fr;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.pc-row:last-of-type{border-bottom:0}
.pc-i{width:22px;height:22px;color:var(--accent);margin-top:2px}
.pc-label{display:block;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.ptcard address{font-style:normal;font-size:1.05rem;line-height:1.45;color:var(--heading);font-weight:500}
.ptcard .pc-row a:not(.btn-mini):not(.chip){color:var(--heading);font-weight:500;word-break:break-word}
.pc-fax{color:var(--muted);font-size:.95rem}
.pc-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.btn-mini{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:.85rem;font-weight:600;padding:8px 14px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--heading);cursor:pointer;text-decoration:none;transition:border-color .15s,background .15s}
.btn-mini:hover{border-color:var(--accent)}
.btn-mini.primary{background:var(--signal);border-color:var(--signal);color:#141618}
.btn-mini.primary:hover{filter:brightness(.95)}
.btn-mini.ok{background:#e3f6e8;border-color:#7ccf95;color:#14532d}
.ptcard .chips{display:flex;flex-wrap:wrap;gap:6px}
.pc-map{padding:6px 0 18px}
.gmap-load{width:100%;height:220px;border:1px dashed var(--line);border-radius:8px;background:var(--surface);color:var(--heading);font:inherit;cursor:pointer;display:grid;place-content:center;gap:4px;text-align:center;transition:border-color .15s}
.gmap-load:hover{border-color:var(--accent)}.gmap-load span{font-weight:600}.gmap-load small{color:var(--muted)}
.pc-map iframe{width:100%;height:280px;border:0;border-radius:8px}
.pc-foot{padding:14px 34px 20px;border-top:1px solid var(--line);background:var(--surface);text-align:right}
.pc-foot a{font-weight:600;color:var(--heading)}
.pc-page .ptcard{max-width:820px;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:var(--shadow)}
.rcard{cursor:pointer}
.rcard strong{font-size:1.02rem}
@media (max-width:560px){.pc-head{padding:24px 56px 20px 26px}.pc-body{padding:4px 20px 8px}.pc-foot{padding:12px 20px 18px}.pc-row{grid-template-columns:24px 1fr;gap:10px}}

/* ---- Google Maps (consent gate + pin) ---- */
.map-gate{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px;background:linear-gradient(135deg,var(--s100),var(--surface));border-radius:inherit}
.map-gate strong{display:block;font-size:1.1rem;color:var(--heading);margin-bottom:6px}.map-gate p{margin:0 auto 14px;max-width:34ch;color:var(--muted);font-size:.92rem}
#map{position:relative}.map-err{padding:24px;color:var(--muted)}
.gpin{width:18px;height:18px;background:#FFE81A;border:3px solid #33465A;transform:skewX(-14deg);box-shadow:0 1px 5px rgba(0,0,0,.45);cursor:pointer;transition:transform .15s}
.gpin:hover,.gpin.hot{transform:skewX(-14deg) scale(1.45);background:#fff}

/* ---- Home: individual product cards ---- */
.pgroup{margin-top:34px}.pgroup:first-of-type{margin-top:8px}
.pgroup-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;padding-bottom:12px;margin-bottom:18px;border-bottom:2px solid var(--line)}
.pgroup-head h3{margin:0;font-size:1.35rem;color:var(--heading)}.pgroup-head p{margin:0;color:var(--muted);font-size:.95rem}
.pgroup-head a{margin-left:auto;font-weight:600;font-size:.9rem;color:var(--heading);text-decoration:none}.pgroup-head a:hover{text-decoration:underline}
.prodgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.prodcard{position:relative;display:flex;flex-direction:column;background:var(--pop,var(--card));border:1px solid var(--line);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 1px 2px rgba(20,22,24,.06),0 8px 22px -14px rgba(20,22,24,.35);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.prodcard::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--signal);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);z-index:2}
.prodcard:hover,.prodcard:focus-visible{transform:translateY(-6px);box-shadow:0 2px 4px rgba(20,22,24,.08),0 22px 40px -18px rgba(20,22,24,.5);border-color:var(--accent)}
.prodcard:hover::before,.prodcard:focus-visible::before{transform:scaleX(1)}
.prodcard-img{position:relative;aspect-ratio:4/3;background:#fff;overflow:hidden;border-bottom:1px solid var(--line)}
.prodcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}.prodcard:hover .prodcard-img img{transform:scale(1.05)}
.prodcard-tag{position:absolute;left:12px;top:12px;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;background:var(--deep-steel);color:#fff;padding:5px 12px 5px 10px;transform:skewX(-14deg)}
.prodcard-tag{display:inline-block}
.prodcard-body{padding:16px 18px 16px;display:flex;flex-direction:column;flex:1}
.prodcard-body h3{margin:0;font-size:1.2rem;line-height:1.2;color:var(--heading)}
.prodcard-body p{margin:6px 0 14px;color:var(--muted);font-size:.9rem;line-height:1.4}
.prodcard-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:12px;border-top:1px solid var(--line);font-size:.82rem;color:var(--muted)}
.prodcard-go{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--surface);color:var(--heading);font-size:1rem;transition:background .2s,transform .25s var(--ease)}
.prodcard:hover .prodcard-go{background:var(--signal);color:#141618;transform:translateX(3px)}
:root[data-theme=dark] .prodcard-img{background:#fff}
@media (max-width:1100px){.prodgrid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.prodgrid{grid-template-columns:repeat(2,1fr);gap:14px}.prodcard-body{padding:12px 14px}.prodcard-body h3{font-size:1.05rem}.prodcard-body p{font-size:.84rem}.pgroup-head a{margin-left:0}}
@media (max-width:420px){.prodgrid{grid-template-columns:1fr}}

/* ---- One card design for the whole site: white card on grey section, soft shadow, yellow bar + lift on hover ---- */
:root{--pop:var(--card)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--pop:#252b31}}
:root[data-theme=dark]{--pop:#252b31}
.ncard,.rcard,.excard,.person{position:relative;background:var(--pop);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 1px 2px rgba(20,22,24,.06),0 8px 22px -14px rgba(20,22,24,.35);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.ncard::before,.rcard::before,.excard::before,.person::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--signal);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);z-index:4;pointer-events:none}
.ncard:hover,.excard:hover,.person:hover,.rcard:hover,.rcard.on,.ncard:focus-within{transform:translateY(-5px);box-shadow:0 2px 4px rgba(20,22,24,.08),0 22px 40px -18px rgba(20,22,24,.5);border-color:var(--accent)}
.ncard:hover::before,.excard:hover::before,.person:hover::before,.rcard:hover::before,.rcard.on::before,.ncard:focus-within::before{transform:scaleX(1)}
/* news */
.ncard-img{border-radius:0;border-bottom:1px solid var(--line)}
.ncard-body{padding:14px 18px 20px}
.ncard h3{font-size:1.12rem;line-height:1.25}
.ncard:hover h3 a{text-decoration:none}
/* rental list (inside a scrolling column, so only a small lift) */
.rlist{padding:8px 8px 8px 2px}
.rcard{padding:16px 18px;margin-bottom:14px}
.rcard:hover,.rcard.on{transform:translateY(-2px)}
.rental{background:var(--surface)}
/* exhibitions */
.excard{border-radius:12px}
.ex-body{padding:20px 22px}
/* contacts */
.person{padding:26px 24px}
.pgrid{display:none}

/* Products page: compact category blocks (one continuous grey area instead of three tall sections) */
.section.cat-sec{padding-top:34px;padding-bottom:6px}
.section.cat-sec:first-of-type{padding-top:40px}
.section.cat-sec:last-of-type{padding-bottom:56px}
.cat-sec .sec-head{margin-bottom:18px}
.cat-sec .prodgrid{gap:18px}

/* ---- scroll reveal (individual transform properties, so the hover lift keeps working) ---- */
.reveal-on .reveal-grid>*{opacity:0;translate:0 44px;scale:.96;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s,opacity .8s var(--ease) var(--d,0s),translate .8s var(--ease) var(--d,0s),scale .8s var(--ease) var(--d,0s)}
.reveal-on .reveal-grid>*.in{opacity:1;translate:0 0;scale:1}
@media (prefers-reduced-motion:reduce){.reveal-on .reveal-grid>*{opacity:1;translate:none;scale:none}}

/* ---- Home slider: cross-fade + slow zoom of the photo, copy slides in one line after another ---- */
.vs-track{display:block;position:relative;height:100%;transition:none;will-change:auto}
.vs-slide{position:absolute;inset:0;flex:none;opacity:0;visibility:hidden;z-index:0;background:none;transition:opacity 1.1s var(--ease),visibility 0s linear 1.1s}
.vs-slide.is-active{opacity:1;visibility:visible;z-index:1;transition:opacity 1.1s var(--ease),visibility 0s}
.vs-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;transform:scale(1.12);transition:transform 0s linear 1.2s}
.vs-slide.is-active .vs-bg{transform:scale(1);transition:transform 6.5s cubic-bezier(.2,.6,.2,1)}
.vs-slide::before{z-index:1}.vs-copy{z-index:2}
/* equal copy height on every slide: title (1 line) + description (2 lines, always reserved) + buttons */
.vs-title{min-height:1.15em;line-height:1.1;white-space:nowrap}
.vs-sub{min-height:2.7em}
.vs-copy>*{opacity:0;transform:translateY(34px);transition:opacity .35s ease,transform .35s ease}
.vs-slide.is-active .vs-copy>*{opacity:1;transform:none;transition:opacity .8s var(--ease),transform .9s var(--ease)}
.vs-slide.is-active .vs-copy>.vs-title{transition-delay:.35s}
.vs-slide.is-active .vs-copy>.vs-sub{transition-delay:.55s}
.vs-slide.is-active .vs-copy>.vs-actions{transition-delay:.75s}
.vs-title::before{transform:skewX(-14deg) scaleY(0);transform-origin:top;transition:transform .7s var(--ease) 0s}
.vs-slide.is-active .vs-title::before{transform:skewX(-14deg) scaleY(1);transition-delay:.25s}
/* bottom tabs: equal height, descriptions always two lines */
.vs-tab{align-items:flex-start;min-height:104px}
.vs-tt em{min-height:2.6em}
/* reduced motion: only the cross-fade */
.vs-reduce .vs-bg,.vs-reduce .vs-slide.is-active .vs-bg{transform:none;transition:none}
.vs-reduce .vs-copy>*,.vs-reduce .vs-slide.is-active .vs-copy>*{transform:none;transition-delay:0s}
@media (prefers-reduced-motion:reduce){.vs-bg,.vs-slide.is-active .vs-bg{transform:none;transition:none}.vs-copy>*,.vs-slide.is-active .vs-copy>*{transform:none;transition-delay:0s}}
@media (max-width:960px){.vs-title{white-space:normal}.vs-tab{min-height:0}}

/* ---- Home slider v2: real cross-dissolve (old picture stays underneath until the new one covers it), slow in-out curve ---- */
.vs-slide{opacity:0;visibility:hidden;z-index:0;transition:none}
.vs-slide.is-leaving{opacity:1;visibility:visible;z-index:0;transition:none}
.vs-slide.is-active{opacity:1;visibility:visible;z-index:1;transition:none;animation:vsin 1.7s cubic-bezier(.45,0,.25,1) both}
@keyframes vsin{from{opacity:0}to{opacity:1}}
/* photo keeps its slow zoom while it is fading out (same declaration for both states, so the running transition is not interrupted) */
.vs-bg{transition:none}
.vs-slide.is-active .vs-bg,.vs-slide.is-leaving .vs-bg{transform:scale(1);transition:transform 6.5s cubic-bezier(.2,.6,.2,1)}
/* copy of the leaving slide only fades (no drop), the new one slides in */
.vs-slide.is-leaving .vs-copy>*{opacity:0;transform:none;transition:opacity .45s ease}
@media (prefers-reduced-motion:reduce){.vs-slide.is-active{animation-duration:1.2s}}
.vs-reduce .vs-slide.is-active{animation-duration:1.2s}

/* Home slider: copy sits low (just above the tab bar) so it stays clear of the crane in the photo */
.vs-slide{align-items:flex-end}
.vs-copy{padding-bottom:132px}
@media (max-width:960px){.vs-copy{padding-bottom:116px}}
.vs-title{font-size:clamp(2.4rem,5.4vw,4.4rem)}

/* ---- Cookie bar ---- */
.cookiebar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:90;width:min(880px,calc(100vw - 28px));display:flex;gap:22px;align-items:center;justify-content:space-between;background:var(--carbon);color:#e6ebee;border:1px solid rgba(255,255,255,.14);border-left:6px solid var(--signal);border-radius:10px;padding:16px 20px;box-shadow:0 18px 50px -10px rgba(0,0,0,.55);animation:cbin .5s var(--ease)}
@keyframes cbin{from{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%,0)}}
.cb-text strong{display:block;color:#fff;font-size:1rem;margin-bottom:2px}.cb-text p{margin:0;font-size:.88rem;line-height:1.45;color:#b9c6cd}.cb-text a{color:var(--signal)}.cb-text b{color:#fff;font-weight:600}
.cb-actions{display:flex;gap:10px;flex:none}.cookiebar .btn-ghost{color:#fff;border-color:rgba(255,255,255,.35)}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}
@media (max-width:640px){.cookiebar{flex-direction:column;align-items:stretch;gap:12px;bottom:10px}.cb-actions{justify-content:flex-end}}
@media (prefers-reduced-motion:reduce){.cookiebar{animation:none}}
.map-gate{background:var(--surface);border:1px solid var(--line)}

/* ---- Download cards: pop design + generated cover ---- */
.dgrid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px}
.doc{position:relative;display:flex;flex-direction:column;background:var(--pop,var(--card));border:1px solid var(--line);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 1px 2px rgba(20,22,24,.06),0 8px 22px -14px rgba(20,22,24,.35);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.doc::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--signal);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);z-index:4}
.doc:hover,.doc:focus-visible{transform:translateY(-6px);box-shadow:0 2px 4px rgba(20,22,24,.08),0 22px 40px -18px rgba(20,22,24,.5);border-color:var(--accent)}
.doc:hover::before,.doc:focus-visible::before{transform:scaleX(1)}
.doc-thumb.is-art{padding:0;background:none;border-bottom:1px solid var(--line);aspect-ratio:4/3}
.dart{position:absolute;inset:0;overflow:hidden;color:#fff;background:linear-gradient(135deg,#33465A 0%,#1f2a35 62%,#141618 120%)}
.dart.bp{background:linear-gradient(135deg,#2b3b4c 0%,#1a232d 70%,#141618 130%)}
.dart.bp::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(147,167,176,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(147,167,176,.13) 1px,transparent 1px);background-size:22px 22px}
.dart::after{content:"";position:absolute;top:-10%;bottom:-10%;right:14%;width:12%;transform:skewX(-14deg);background:linear-gradient(180deg,rgba(147,167,176,.22),rgba(147,167,176,.03))}
.dart-ico{position:absolute;left:50%;top:44%;width:62%;transform:translate(-50%,-50%);color:var(--signal);z-index:1;filter:drop-shadow(0 2px 8px rgba(0,0,0,.35));transition:transform .45s var(--ease)}
.doc:hover .dart-ico{transform:translate(-50%,-50%) scale(1.07)}
.dart-txt{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:34px 16px 12px;background:linear-gradient(0deg,rgba(20,22,24,.92),rgba(20,22,24,0));display:flex;flex-direction:column;gap:1px}
.dart-txt small{font:600 .66rem/1 var(--font);letter-spacing:.16em;text-transform:uppercase;color:var(--steel)}
.dart-txt b{font:700 1.2rem/1.15 var(--font);color:#fff}.dart-txt span{font:500 .88rem/1.2 var(--font);color:#cfd8de}
.dart-fmt{position:absolute;right:12px;top:12px;z-index:3;font:700 .68rem/1 var(--font);font-style:normal;letter-spacing:.1em;background:var(--signal);color:#141618;padding:5px 10px 5px 8px;transform:skewX(-14deg)}
.doc-body{padding:14px 16px 16px;flex:1;display:flex;flex-direction:column;gap:3px}
.doc-body strong{font-size:1.02rem}

/* ---- Photo galleries (crane pages + Gallery section): every photo is a pop card ---- */
.gallery{gap:18px}
.gallery a{position:relative;display:block;aspect-ratio:4/3;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 1px 2px rgba(20,22,24,.06),0 8px 22px -14px rgba(20,22,24,.35);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.gallery a::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--signal);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);z-index:2;pointer-events:none}
.gallery a:hover,.gallery a:focus-visible{transform:translateY(-6px);box-shadow:0 2px 4px rgba(20,22,24,.08),0 22px 40px -18px rgba(20,22,24,.5);border-color:var(--accent)}
.gallery a:hover::before,.gallery a:focus-visible::before{transform:scaleX(1)}
.gallery a:hover img{transform:scale(1.06)}
.dart-ico{top:38%;width:54%}

/* ---- Larger header logo (scales with the viewport) ---- */
.bar{height:78px}
.brand img{height:clamp(32px,3.2vw,46px)}
@media (max-width:960px){.bar{height:68px}.brand img{height:30px}}
.bar .btn{white-space:nowrap}
@media (max-width:1200px) and (min-width:961px){.bar{gap:18px}.main-nav{gap:0}.main-nav a{padding-left:9px;padding-right:9px}}

.prodcard-foot{gap:12px;align-items:center}.prodcard-foot>span:first-child{font-size:.84rem;line-height:1.3;color:var(--heading);font-weight:500}

/* ---- "Next" icon from Play Icon set (48 px grid, r=21, round caps): outline circle + arrow; yellow filled circle on hover ---- */
.prodcard-go{flex:none;width:40px;height:40px;aspect-ratio:1;border-radius:50%;background:none;color:var(--heading);display:block;transition:transform .25s var(--ease)}
.prodcard-go svg{display:block;width:100%;height:100%;overflow:visible}
.prodcard-go circle{fill:transparent;transition:fill .2s,stroke .2s}
.prodcard-go .ar{transition:stroke .2s}
.prodcard:hover .prodcard-go,.prodcard:focus-visible .prodcard-go{background:none;color:#141618;transform:translateX(3px)}
.prodcard:hover .prodcard-go circle,.prodcard:focus-visible .prodcard-go circle{fill:var(--signal);stroke:var(--signal)}

/* cookie bar: icons from Play Icon set (Go #3EC98A = accept, Stop #F2564F = decline) */
.cb-actions{gap:14px;align-items:center}
.cb-icon{flex:none;width:52px;height:52px;padding:0;border:0;background:none;cursor:pointer;border-radius:50%;transition:transform .2s var(--ease)}
.cb-icon svg{display:block;width:100%;height:100%;overflow:visible}
.cb-icon circle{fill:transparent;transition:fill .2s}
.cb-yes{color:#3EC98A}.cb-no{color:#F2564F}
.cb-icon:hover,.cb-icon:focus-visible{transform:scale(1.1)}
.cb-yes:hover circle,.cb-yes:focus-visible circle{fill:#3EC98A}.cb-no:hover circle,.cb-no:focus-visible circle{fill:#F2564F}
.cb-yes:hover path,.cb-yes:focus-visible path,.cb-no:hover path,.cb-no:focus-visible path{stroke:#141618}
.cb-icon:focus-visible{outline:3px solid var(--signal);outline-offset:3px}

/* product cards: red cross (Stop #F2564F) by default, green arrow (Go #3EC98A) when the card is hovered / focused – icons from Play Icon set */
.prodcard-go{position:relative;color:inherit}
.prodcard-go svg{position:absolute;inset:0;width:100%;height:100%;transition:opacity .25s var(--ease),transform .35s var(--ease)}
.prodcard-go .go-no{color:#F2564F;opacity:1}
.prodcard-go .go-yes{color:#3EC98A;opacity:0;transform:scale(.8) rotate(-30deg)}
.prodcard-go .go-yes circle{fill:rgba(62,201,138,.14)}
.prodcard:hover .prodcard-go,.prodcard:focus-visible .prodcard-go{color:inherit;transform:none}
.prodcard:hover .prodcard-go .go-no,.prodcard:focus-visible .prodcard-go .go-no{opacity:0;transform:scale(.8) rotate(30deg)}
.prodcard:hover .prodcard-go .go-yes,.prodcard:focus-visible .prodcard-go .go-yes{opacity:1;transform:none}
.prodcard:hover .prodcard-go circle,.prodcard:focus-visible .prodcard-go circle{stroke:currentColor}
.prodcard:hover .prodcard-go .go-yes circle{fill:rgba(62,201,138,.14)}
.prodcard:hover .prodcard-go .go-no circle{fill:transparent}
.prodcard-go circle{fill:transparent}
@media (prefers-reduced-motion:reduce){.prodcard-go svg{transition:opacity .01s}}

/* default icon on product cards: the "1" status icon from Play Icon set, ring in signal yellow */
.prodcard-go .go-no{color:var(--signal)}

/* ---- forms ---- */
.hp{position:absolute!important;left:0;top:auto;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}
.form-msg{margin-top:14px}.form-msg:empty{display:none}
.form-msg .sent,#formMsg .sent{background:rgba(62,201,138,.14);border:1px solid #3EC98A;border-left-width:5px;border-radius:8px;padding:12px 16px;color:var(--text)}
.form-msg .sent strong{display:block}
.err-banner{background:rgba(242,86,79,.12);border:1px solid #F2564F;border-left-width:5px;border-radius:8px;padding:12px 16px;color:var(--text)}
.err-banner a{color:inherit;text-decoration:underline}
.cf-ts{margin:6px 0 12px}
.inq button[disabled]{opacity:.6;cursor:progress}

/* ---- Compact spacing pass (all pages) ---- */
.section{padding:52px 0}
.section.tight{padding:28px 0 52px}
.sec-head{margin-bottom:20px}
.page-head{padding:28px 0 16px}
.cta-band{padding:40px 0}
.site-footer{padding:44px 0 20px}.foot-base{margin-top:28px;padding-top:16px}
.pgroup{margin-top:26px}.pgroup-head{margin-bottom:14px;padding-bottom:10px}
.prodgrid{gap:18px}
.news-grid{gap:20px}
.home-news{grid-template-columns:repeat(3,1fr)}
.dl-group{margin-bottom:26px}.dl-group h3{margin-bottom:12px;padding-bottom:8px}
.dgrid{gap:16px}
.doc-thumb.is-art{aspect-ratio:16/10}
.doc-body{padding:12px 14px 14px}
.dart-txt{padding:26px 14px 10px}
.people{gap:16px}.person{padding:20px}
.person-photo{margin-bottom:8px}
.gallery{gap:14px}
@media (max-width:960px){.section{padding:40px 0}.section.tight{padding:22px 0 40px}.home-news{grid-template-columns:1fr}}

/* ---- Featured product card: spans two columns, photo left / text right ---- */
.prodcard.feat{grid-column:span 2;flex-direction:row}
.prodcard.feat .prodcard-img{flex:0 0 58%;aspect-ratio:auto;border-bottom:0;border-right:1px solid var(--line)}
.prodcard.feat .prodcard-img img{position:absolute;inset:0}
.prodcard.feat .prodcard-body{padding:26px 26px 22px;justify-content:center}
.prodcard.feat .prodcard-body h3{font-size:1.8rem}
.prodcard.feat .prodcard-body p{font-size:1.02rem;margin:10px 0 22px}
.prodcard.feat .prodcard-foot{margin-top:0;padding-top:16px}
@media (max-width:760px){.prodcard.feat{flex-direction:column}.prodcard.feat .prodcard-img{flex:none;aspect-ratio:4/3;border-right:0;border-bottom:1px solid var(--line)}.prodcard.feat .prodcard-body h3{font-size:1.3rem}}
@media (max-width:420px){.prodcard.feat{grid-column:span 1}}
.prodcard.feat .prodcard-img img{object-fit:cover!important;padding:0!important;background:none!important}

/* ---- Featured card v2: same structure as the small cards (photo on top, text below), just two columns wide.
        The original preview photo is cropped (never stretched) to the wide frame. ---- */
.prodcard.feat{flex-direction:column}
.prodcard.feat .prodcard-img{flex:none;aspect-ratio:2.74/1;border-right:0;border-bottom:1px solid var(--line)}
.prodcard.feat .prodcard-img img{object-position:50% 52%}
.prodcard.feat .prodcard-body{padding:16px 18px;justify-content:flex-start}
.prodcard.feat .prodcard-body h3{font-size:1.45rem}
.prodcard.feat .prodcard-body p{font-size:.92rem;margin:6px 0 14px}
.prodcard.feat .prodcard-foot{margin-top:auto;padding-top:12px}
@media (max-width:760px){.prodcard.feat .prodcard-img{aspect-ratio:2.2/1}.prodcard.feat .prodcard-body h3{font-size:1.2rem}}
@media (max-width:420px){.prodcard.feat .prodcard-img{aspect-ratio:4/3}}

/* Featured card v3: text scaled up with the wider card so it fills the space */
.prodcard.feat .prodcard-img{aspect-ratio:2.95/1}
.prodcard.feat .prodcard-body{padding:20px 26px 18px}
.prodcard.feat .prodcard-body h3{font-size:2.05rem;letter-spacing:-.015em}
.prodcard.feat .prodcard-body p{font-size:1.2rem;line-height:1.35;margin:8px 0 18px}
.prodcard.feat .prodcard-foot{padding-top:14px;gap:18px}
.prodcard.feat .prodcard-foot>span:first-child{font-size:1.05rem}
.prodcard.feat .prodcard-go{width:54px;height:54px}
@media (max-width:1100px){.prodcard.feat .prodcard-body h3{font-size:1.7rem}.prodcard.feat .prodcard-body p{font-size:1.05rem}.prodcard.feat .prodcard-foot>span:first-child{font-size:.95rem}.prodcard.feat .prodcard-go{width:46px;height:46px}}
@media (max-width:760px){.prodcard.feat .prodcard-img{aspect-ratio:2.2/1}.prodcard.feat .prodcard-body{padding:16px 18px}.prodcard.feat .prodcard-body h3{font-size:1.35rem}.prodcard.feat .prodcard-body p{font-size:.95rem}.prodcard.feat .prodcard-foot>span:first-child{font-size:.88rem}.prodcard.feat .prodcard-go{width:40px;height:40px}}
@media (max-width:420px){.prodcard.feat .prodcard-img{aspect-ratio:4/3}}

/* ---- Product cards: clearly framed even when not hovered (2 px steel frame + layered shadow) ---- */
:root{--card-edge:#b4c1c9}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--card-edge:#4a5864}}
:root[data-theme=dark]{--card-edge:#4a5864}
.prodcard{border:2px solid var(--card-edge);border-radius:14px;box-shadow:0 0 0 1px rgba(20,22,24,.25),0 3px 6px rgba(20,22,24,.22),0 18px 34px -14px rgba(20,22,24,.65)}
.prodcard:hover,.prodcard:focus-visible{border-color:var(--signal);box-shadow:0 0 0 1px rgba(255,232,26,.35),0 4px 8px rgba(20,22,24,.25),0 26px 44px -16px rgba(20,22,24,.75)}

/* Product cards: no sliding yellow bar – the frame simply turns yellow on hover/focus */
.prodcard::before{display:none}
.prodcard{transition:transform .25s var(--ease),box-shadow .25s var(--ease)}

/* ---- All cards: dark-blue (Deep Steel) frame by default; hover/selection only highlights the card (lift, deeper shadow, lighter surface) – no yellow frame, no sliding bar ---- */
:root{--card-edge:#33465A;--pop-hover:#f1f6f8}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--card-edge:#33465A;--pop-hover:#2d353c}}
:root[data-theme=dark]{--card-edge:#33465A;--pop-hover:#2d353c}
.prodcard,.ncard,.excard,.person,.rcard,.doc,.gallery a{border:2px solid var(--card-edge)}
.prodcard::before,.ncard::before,.excard::before,.person::before,.rcard::before,.doc::before,.gallery a::before{display:none}
.prodcard:hover,.prodcard:focus-visible,.ncard:hover,.ncard:focus-within,.excard:hover,.person:hover,.rcard:hover,.rcard.on,.doc:hover,.doc:focus-visible,.gallery a:hover,.gallery a:focus-visible{border-color:var(--card-edge)}
.prodcard:hover,.prodcard:focus-visible,.ncard:hover,.ncard:focus-within,.excard:hover,.person:hover,.rcard:hover,.rcard.on,.doc:hover,.doc:focus-visible{background:var(--pop-hover)}
.prodcard:hover,.prodcard:focus-visible{box-shadow:0 0 0 1px rgba(51,70,90,.5),0 4px 8px rgba(20,22,24,.25),0 26px 44px -16px rgba(20,22,24,.75)}

/* Dark mode: card frame in signal yellow (light mode keeps the dark-blue frame) */
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--card-edge:#FFE81A}}
:root[data-theme=dark]{--card-edge:#FFE81A}

/* ---- Rental page layout (as on the old site): filters on top, wide map, list of partners below the map ---- */
.rental-stack{display:block;padding-top:12px;padding-bottom:56px}
.rental-stack .rmap{position:static;margin-bottom:22px}
.rental-stack #map{height:clamp(380px,56vh,560px);border-radius:12px}
.rental-stack .rlist{max-height:none;overflow:visible;padding:0}
.rental-stack .count{margin:0 0 14px;font-weight:600;color:var(--heading)}
.rental-stack #rlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.rental-stack .rcard{margin-bottom:0}
@media (max-width:960px){.rental-stack #map{height:340px}}
.rental-stack{padding-top:24px}

/* ---- Rental: crane filter chips (old-site system) ---- */
.crane-filter{margin:6px 0 14px;padding-top:14px;border-top:1px solid var(--line)}
.cf-label{display:block;margin:0 0 10px;font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cf-chips{display:flex;flex-direction:column;gap:8px}
.cf-row{display:flex;flex-wrap:wrap;gap:8px 28px}
.cf-fam{display:flex;flex-wrap:wrap;gap:6px}
.cf-chip{appearance:none;margin:0;padding:9px 14px;border:2px solid var(--card-edge,#33465A);border-radius:6px;background:var(--pop,var(--card));color:var(--heading);font:600 .88rem/1 var(--font);cursor:pointer;transition:background .15s,color .15s,box-shadow .15s}
.cf-chip:hover,.cf-chip:focus-visible{background:var(--pop-hover,#f1f6f8)}
.cf-chip[aria-pressed=true]{background:var(--deep-steel);border-color:var(--deep-steel);color:#fff;box-shadow:inset 0 -3px 0 var(--signal)}
.cf-chip[disabled]{opacity:.35;cursor:default;background:transparent}
.cf-status{margin-top:12px;min-height:1.4em;font-size:.92rem;color:var(--text)}
.cf-status:empty{display:none}
.cf-tag{display:inline-block;padding:2px 9px;border:1px solid var(--line);border-radius:99px;font-weight:600;font-size:.85rem;color:var(--heading)}
.cf-clear{margin-left:6px;padding:3px 12px;border:1px solid var(--line);border-radius:99px;background:none;color:var(--heading);font:600 .82rem var(--font);cursor:pointer}
.cf-clear:hover{border-color:var(--signal);box-shadow:0 0 0 2px rgba(255,232,26,.35)}
/* Rental filter bar: search (full width) -> crane chips -> regions */
.rental-bar{display:block}
.rental-bar .crane-filter{grid-column:auto;margin:16px 0 14px}
.rental-bar .chips{margin:0}

/* ---- Model number inside the photo (old-site system): light theme = dark blue, dark theme = yellow ---- */
:root{--num-color:#33465A}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--num-color:#FFE81A}}
:root[data-theme=dark]{--num-color:#FFE81A}
.prodcard-num{position:absolute;left:10px;bottom:-12px;z-index:2;font:700 84px/1 var(--font);letter-spacing:-.02em;color:var(--num-color);opacity:.9;pointer-events:none;user-select:none}
.prodcard.feat .prodcard-num{font-size:112px;left:16px;bottom:-16px}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .prodcard-num{-webkit-text-stroke:3px rgba(20,22,24,.85);paint-order:stroke fill;opacity:1}}
:root[data-theme=dark] .prodcard-num{-webkit-text-stroke:3px rgba(20,22,24,.85);paint-order:stroke fill;opacity:1}
@media (max-width:760px){.prodcard-num{font-size:60px;bottom:-9px}.prodcard.feat .prodcard-num{font-size:72px}}

/* Model number: ~30 % smaller, always bottom-right of the photo */
.prodcard-num{left:auto;right:12px;font-size:59px;bottom:-8px}
.prodcard.feat .prodcard-num{left:auto;right:18px;font-size:78px;bottom:-11px}
@media (max-width:760px){.prodcard-num{font-size:42px;bottom:-6px}.prodcard.feat .prodcard-num{font-size:50px}}

/* Model number: smaller, always over the photo in the bottom-right corner (photos keep their full size) */
.prodcard-num{left:auto;right:10px;bottom:8px;font-size:40px;line-height:.85}
.prodcard.feat .prodcard-num{right:16px;bottom:10px;font-size:54px}
@media (max-width:760px){.prodcard-num{font-size:30px;bottom:6px;right:8px}.prodcard.feat .prodcard-num{font-size:38px}}

/* Model number colour taken from the old site (#52c8c1, 80 % opacity) – same in light and dark theme, no outline */
:root,:root[data-theme=dark],:root[data-theme=light]{--num-color:#52c8c1}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--num-color:#52c8c1}}
.prodcard-num{color:var(--num-color);opacity:.8;-webkit-text-stroke:0;paint-order:normal}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .prodcard-num{-webkit-text-stroke:0;opacity:.8}}
:root[data-theme=dark] .prodcard-num{-webkit-text-stroke:0;opacity:.8}

/* No model number in the photo any more; the product names are twice as large and scale with the card so the longest ones still fit */
.prodcard{container-type:inline-size}
.prodcard-num{display:none}
.prodcard-body h3{font-size:clamp(1.5rem,11.4cqw,2.4rem);line-height:1.05;letter-spacing:-.025em}
.prodcard.feat .prodcard-body h3{font-size:clamp(2.2rem,11cqw,4.1rem);letter-spacing:-.03em}

/* ---- video cards inside the download groups (Manuals / Drawings / Tools) ---- */
button.doc.doc-video{text-align:left;font:inherit;color:inherit;cursor:pointer;padding:0}
.doc-thumb.is-video{position:relative;aspect-ratio:4/3;background:#000;overflow:hidden;border-bottom:1px solid var(--line)}
.doc-thumb.is-video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.92;transition:transform .45s var(--ease)}
.doc-video:hover .doc-thumb.is-video img{transform:scale(1.06)}
.doc-thumb.is-video .play{position:absolute;left:50%;top:50%;margin:-20px 0 0 -28px;width:56px;height:40px}
.doc.doc-video .tag{background:var(--signal);color:#141618}
.dgrid .video.playing{grid-column:span 2;aspect-ratio:16/9;border-radius:12px;overflow:hidden}
.doc.doc-video .tag{align-self:flex-start}

/* ---- language switcher ---- */
.lang{position:relative;display:inline-block}
.lang-btn{width:auto;min-width:38px;padding:0 9px;grid-auto-flow:column;gap:6px;display:inline-grid;align-items:center}
.lang-code{font-size:12px;font-weight:600;letter-spacing:.04em}
.lang-list{position:absolute;right:0;top:calc(100% + 8px);z-index:60;margin:0;padding:6px;list-style:none;min-width:170px;background:var(--bg,#fff);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 12px 32px rgba(0,0,0,.22)}
.lang-list[hidden]{display:none}
.lang-list a{display:block;padding:9px 12px;border-radius:6px;color:var(--text);text-decoration:none;font-size:15px;white-space:nowrap}
.lang-list a:hover,.lang-list a:focus-visible{background:var(--line);outline:none}
.lang-list a[aria-current]{font-weight:700;color:var(--accent)}
.legal-note{margin:14px 0 0;padding:10px 14px;border-left:3px solid var(--accent);background:var(--line);border-radius:4px;font-size:.95rem}

/* ---- fonts for scripts Barlow does not cover ---- */
:lang(ja){--cjk:"Yu Gothic UI","Hiragino Sans","Noto Sans JP","Meiryo",sans-serif}
:lang(zh){--cjk:"Microsoft YaHei UI","PingFang SC","Noto Sans SC","Heiti SC",sans-serif}
:lang(ar){--cjk:"Segoe UI","Tahoma","Noto Sans Arabic","Geeza Pro",sans-serif}
html:lang(ja) body,html:lang(zh) body,html:lang(ar) body{font-family:"Barlow",var(--cjk),sans-serif}
html:lang(ja) :is(h1,h2,h3,h4,.btn,nav a),html:lang(zh) :is(h1,h2,h3,h4,.btn,nav a),html:lang(ar) :is(h1,h2,h3,h4,.btn,nav a){font-family:"Barlow",var(--cjk),sans-serif;letter-spacing:0;text-transform:none}
html:lang(ja) body,html:lang(zh) body{line-height:1.75}
html:lang(ar) body{line-height:1.8}

/* ---- right-to-left (Arabic) ---- */
[dir=rtl] .lang-list{right:auto;left:0}
[dir=rtl] .legal-note{border-left:0;border-right:3px solid var(--accent)}
[dir=rtl] body{text-align:right}
[dir=rtl] ul,[dir=rtl] ol{padding-inline-start:1.2em;padding-inline-end:0}
[dir=rtl] .foot-addr,[dir=rtl] address,[dir=rtl] .eq,[dir=rtl] .dgrid,[dir=rtl] .pc-city{direction:ltr;text-align:left}
html{overflow-x:hidden}
[dir=rtl] .slider,[dir=rtl] .hero,[dir=rtl] .hero-nav{direction:ltr}
[dir=rtl] .slide-copy,[dir=rtl] .hero-copy{direction:rtl}
[dir=rtl] .cookiebar{border-left:1px solid rgba(255,255,255,.14);border-right:6px solid var(--signal)}
.inq .two>*,.inq label{min-width:0}
.inq input:not([type=checkbox]),.inq textarea,.inq select{min-width:0;width:100%;box-sizing:border-box}
@media (max-width:560px){.inq .two{grid-template-columns:1fr}}

/* ---- narrow title bar at the bottom of every video ---- */
.video .vbar{font-family:inherit;position:absolute;left:0;right:0;bottom:0;padding:7px 12px;background:linear-gradient(0deg,rgba(0,0,0,.82),rgba(0,0,0,.6));color:#fff;font-size:.8rem;font-weight:500;line-height:1.25;text-align:start;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;direction:ltr;unicode-bidi:plaintext}
.video:hover .vbar{background:rgba(0,0,0,.9)}

/* ---- product head: pitch line + video next to the headline ---- */
.product-head .pitch{font-size:clamp(1.15rem,1.9vw,1.5rem);line-height:1.35;font-weight:500;color:var(--heading);max-width:30em;margin:.7rem 0 .4rem}
.ph-vid .video{aspect-ratio:16/9;border-radius:var(--r);box-shadow:0 18px 50px -18px rgba(0,0,0,.45)}
.ph-vid .video img{opacity:1}

/* ---- Products: what is what (same card as the products) ---- */
.kinds-sec{padding-block:36px 8px}
.kinds{grid-template-columns:repeat(3,1fr)}
.kindcard .prodcard-body h3{font-size:1.5rem}
@media (max-width:860px){.kinds{grid-template-columns:1fr}}

/* ---- Rental on desktop: filters in a sticky side column, map and results to the right ---- */
@media (min-width:1100px){
  .rental-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:44px;align-items:start;padding-top:30px;padding-bottom:64px}
  .rental-side{position:sticky;top:92px;max-height:calc(100vh - 112px);overflow-y:auto;padding:0 8px 8px 2px;scrollbar-width:thin}
  .rental-side .rental-bar{padding:0;display:block}
  .rental-side .crane-filter{margin-top:20px;padding-top:18px}
  .rental-side #rreg{display:grid;gap:6px;margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}
  .rental-side #rreg .chip{display:flex;justify-content:space-between;align-items:center;width:100%;border-radius:8px;padding:10px 14px;text-align:left}
  .rental-main .rental-stack{padding:0}
  .rental-main .rental-stack #map{height:clamp(300px,40vh,430px)}
  .rental-main .rental-stack #rlist{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1640px){
  .rental-main .rental-stack #rlist{grid-template-columns:repeat(3,minmax(0,1fr))}
  .rental-layout{grid-template-columns:350px minmax(0,1fr)}
}
@media (min-width:1100px){
  .rental-side .cf-chip{padding:5px 11px;font-size:.84rem}
  .rental-side #rreg .chip{padding:8px 14px}
  .rental-side #rreg{gap:5px}
}

/* ---- Contact: routes, form + address/map, people by role ---- */
.routes{grid-template-columns:repeat(4,1fr)}
.routecard .prodcard-body{min-height:190px}.routecard .prodcard-body h3{font-size:1.3rem}
.contact-main{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:start}
.cm-form .inq.flat{max-width:none}
.cm-side{display:grid;gap:22px}
.cm-card{border:1px solid var(--line);border-radius:var(--r);padding:20px 24px;background:var(--card)}.cm-card h3{margin:0 0 .5rem}
.cm-side .contact-map{position:static}.cm-side #map{height:300px;border-radius:12px}
.people-group{margin:28px 0 14px;font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.people-group:first-of-type{margin-top:0}
@media (max-width:1020px){.routes{grid-template-columns:repeat(2,1fr)}.contact-main{grid-template-columns:1fr}}
@media (max-width:560px){.routes{grid-template-columns:1fr}.routecard .prodcard-body{min-height:0}}
.inq select{padding:11px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--text);font:inherit;width:100%;box-sizing:border-box;min-width:0}

/* ---- confirmed descriptions: product head + category intros ---- */
.product-head .desc{max-width:34em;margin:.2rem 0 0;color:var(--text);line-height:1.6}
.cat-intro{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px 40px;max-width:1100px;margin:-4px 0 26px}
.cat-intro h3{margin:0 0 .3rem;font-size:1.15rem}.cat-intro p{margin:0;line-height:1.6;color:var(--text)}
/* compact cookie bar on phones: text and the two round buttons side by side */
@media (max-width:640px){
  .cookiebar{flex-direction:row;align-items:center;gap:12px;padding:12px 14px;bottom:8px;border-left-width:4px}
  .cb-text strong{font-size:.92rem}.cb-text p{font-size:.78rem;line-height:1.35}
  .cb-actions{flex-direction:column;gap:8px}.cb-icon{width:40px;height:40px}
}

/* ---- About ---- */
.about-lead{max-width:46em;font-size:1.2rem;line-height:1.6;color:var(--text)}
.numstrip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.numstrip li{border-top:4px solid var(--signal);padding-top:12px}
.numstrip strong{display:block;font-size:clamp(2rem,4vw,3rem);line-height:1;color:var(--heading)}
.numstrip span{display:block;margin-top:.4rem;color:var(--muted)}
.about-cols{display:grid;grid-template-columns:1fr 1fr;gap:48px}.about-cols p{line-height:1.65;max-width:34em}
.screen-list{list-style:none;margin:0;padding:0;display:grid;gap:12px;max-width:50em}
.screen-list li{padding:14px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);line-height:1.5}
@media (max-width:860px){.numstrip{grid-template-columns:repeat(2,1fr)}.about-cols{grid-template-columns:1fr;gap:28px}}

.screen-list a{text-decoration:none}.screen-list a:hover strong{text-decoration:underline}
.credited{max-width:50em;margin:22px 0 0;color:var(--muted);line-height:1.6}.credited strong{color:var(--heading)}
/* ---- Contact: business-card style people, social links beside the address ---- */
.bcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.bcard{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 190px;min-height:236px;border-radius:14px;overflow:hidden;color:#fff;background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);border:2px solid #1a2940;box-shadow:0 1px 2px rgba(20,22,24,.08),0 14px 30px -18px rgba(20,22,24,.55);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.bcard:hover{transform:translateY(-4px);box-shadow:0 2px 4px rgba(20,22,24,.1),0 24px 40px -18px rgba(20,22,24,.6)}
.bcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:var(--signal);z-index:3}
.bcard::after{content:"";position:absolute;right:-34px;top:-24px;bottom:-24px;width:230px;background:rgba(255,255,255,.08);transform:skewX(-14deg);z-index:0}
.bc-body{position:relative;z-index:2;padding:24px 6px 22px 30px;display:flex;flex-direction:column;min-width:0}
.bc-photo{position:relative;z-index:1;align-self:end;justify-self:end;width:100%}
.bc-photo img{display:block;width:100%;height:auto;max-height:236px;object-fit:contain;object-position:bottom center}
.bc-photo span{display:grid;place-items:center;height:140px;font-size:2rem;font-weight:700;color:var(--signal)}
.bcard.nocut .bc-photo img{border-radius:50%;margin:0 0 20px}
.bcard h3{color:#fff;font-size:1.4rem;line-height:1.15;margin:0}
.bcard .role{color:var(--signal);text-transform:uppercase;letter-spacing:.08em;font-size:.74rem;font-weight:700;margin:.3rem 0 1rem}
.bc-lines{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:7px;font-size:.92rem}
.bc-lines li{display:flex;gap:9px;align-items:center;min-width:0}.bc-lines svg{flex:none;color:var(--signal)}
.bc-lines a{color:#e6ebee;text-decoration:none;overflow-wrap:anywhere}.bc-lines a:hover{color:var(--signal)}
.bcard .btn{align-self:flex-start;margin-top:auto}
@media (max-width:1020px){.bcards{grid-template-columns:1fr}}
@media (max-width:480px){.bcard{grid-template-columns:minmax(0,1fr) 128px;min-height:210px}.bc-body{padding:20px 4px 18px 24px}.bcard h3{font-size:1.2rem}.bc-lines{font-size:.84rem}}
.cm-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:26px;align-items:start}
.social-list{list-style:none;margin:0;padding:0 0 0 26px;border-left:1px solid var(--line);display:grid;gap:14px;align-content:start}
.social-list a{display:flex;gap:11px;align-items:center;text-decoration:none;color:var(--heading);font-weight:600}
.social-list svg{flex:none;padding:7px;box-sizing:content-box;width:22px;height:22px;border:1.5px solid var(--line);border-radius:50%;transition:background .2s,color .2s,border-color .2s}
.social-list a:hover svg{background:var(--signal);color:#141618;border-color:var(--signal)}
@media (max-width:560px){.cm-card{grid-template-columns:1fr}.social-list{padding:16px 0 0;border-left:0;border-top:1px solid var(--line);grid-template-columns:1fr 1fr}}
.bc-body{order:1}.bc-photo{order:2}
@media (max-width:480px){.bcard{grid-template-columns:minmax(0,1fr) 112px}.bc-body{padding:18px 2px 16px 22px}.bc-lines{font-size:.8rem;gap:6px}.bc-lines li{gap:7px}.bc-lines a{overflow-wrap:normal}.bcard .btn{padding-inline:12px}}

/* raise two portraits in their frames (scaled from the bottom edge so the shoulders still reach the card edge) */

/* four family cards */
.kinds{grid-template-columns:repeat(2,1fr)}
@media (min-width:1100px){.kinds{grid-template-columns:repeat(4,1fr)}}
@media (max-width:640px){.kinds{grid-template-columns:1fr}}
.kindcard .prodcard-body h3{font-size:1.4rem}

.rcard .dist{display:block;margin-top:4px;font-size:.78rem;font-weight:600;color:var(--muted);letter-spacing:.02em}

/* city search */
.rental-stack #rlist .citybox{grid-column:1/-1;margin:0 0 -6px;font-weight:600;color:var(--heading)}
.rcard.closest{outline:3px solid var(--signal);outline-offset:2px}
.rcard .badge{display:inline-block;margin-bottom:8px;padding:3px 10px;background:var(--signal);color:#141618;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;transform:skewX(-10deg)}
.citypin{width:18px;height:18px;border-radius:50%;background:#4aa3ff;border:3px solid #fff;box-shadow:0 0 0 2px rgba(74,163,255,.5),0 2px 6px rgba(0,0,0,.5)}
.geo-credit{margin:18px 0 0;font-size:.78rem;color:var(--muted)}.geo-credit a{color:inherit}

/* ---- small rental partner cards: business-card look (navy, yellow edge) ---- */
article.rcard{position:relative;display:flex;flex-direction:column;overflow:hidden;color:#fff;background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);border:2px solid #1a2940;border-radius:14px;padding:20px 20px 14px 28px;margin:0;text-align:left;cursor:pointer;box-shadow:0 1px 2px rgba(20,22,24,.08),0 12px 26px -18px rgba(20,22,24,.55);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
article.rcard::before{display:block;content:"";position:absolute;left:0;top:0;bottom:0;right:auto;width:7px;height:auto;background:var(--signal);transform:none;z-index:3}
article.rcard::after{content:"";position:absolute;right:-30px;top:-20px;bottom:-20px;width:150px;background:rgba(255,255,255,.07);transform:skewX(-14deg);z-index:0;pointer-events:none}
article.rcard:hover,article.rcard.on{transform:translateY(-3px);background:linear-gradient(135deg,#1f3151 0%,#2e4a77 100%);border-color:#1a2940;box-shadow:0 2px 4px rgba(20,22,24,.1),0 20px 36px -18px rgba(20,22,24,.6)}
article.rcard>*{position:relative;z-index:1}
.rc-eyebrow{margin:0 0 6px;font-size:.7rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--signal)}
.rc-name{margin:0;font-size:1.12rem;line-height:1.25;color:#fff}.rc-name a{color:inherit;text-decoration:none}
.rc-name a::after{content:"";position:absolute;inset:0;z-index:2}
.rc-city{display:flex;align-items:center;gap:7px;margin:6px 0 0;color:#c4d0dc;font-size:.92rem}.rc-city svg{flex:none;color:var(--signal)}
article.rcard .eq{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0}
article.rcard .eq i{font-style:normal;font-size:.72rem;font-weight:600;padding:3px 10px;border:1px solid rgba(255,255,255,.28);border-radius:999px;color:#e6ebee;background:rgba(255,255,255,.05)}
.rc-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:16px}
.rc-acts{display:flex;gap:8px;position:relative;z-index:4}
.rc-act{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);color:#fff;text-decoration:none;transition:background .2s,color .2s,border-color .2s}
.rc-act:hover,.rc-act:focus-visible{background:var(--signal);border-color:var(--signal);color:#141618}
article.rcard .go{float:none;font-size:.82rem;font-weight:700;color:var(--signal)}
article.rcard.closest{outline:3px solid var(--signal);outline-offset:2px}
article.rcard .badge{display:inline-block;align-self:flex-start;margin:0 0 10px;padding:3px 10px;background:var(--signal);color:#141618;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;transform:skewX(-10deg)}
@media (max-width:480px){article.rcard{padding:18px 16px 12px 24px}.rc-name{font-size:1.05rem}}

/* ---- product cards: the description area (below the photo) gets the navy / yellow-edge scheme; photos and card frames stay as they were ---- */
a.prodcard .prodcard-body{position:relative;overflow:hidden;background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);color:#fff;padding-left:24px;transition:background .25s var(--ease)}
a.prodcard .prodcard-body::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:var(--signal)}
a.prodcard .prodcard-body::after{content:"";position:absolute;right:-34px;top:-30px;bottom:-30px;width:150px;background:rgba(255,255,255,.07);transform:skewX(-14deg);pointer-events:none}
a.prodcard .prodcard-body>*{position:relative;z-index:1}
a.prodcard:hover .prodcard-body,a.prodcard:focus-visible .prodcard-body{background:linear-gradient(135deg,#1f3151 0%,#2e4a77 100%)}
a.prodcard .prodcard-body h3{color:#fff}
a.prodcard .prodcard-body p{color:#c4d0dc}
a.prodcard .prodcard-foot{border-top-color:rgba(255,255,255,.18)}
a.prodcard .prodcard-foot>span:first-child{color:#e6ebee}
a.prodcard .prodcard-go{color:var(--signal)}
a.prodcard:hover .prodcard-go,a.prodcard:focus-visible .prodcard-go{color:#141618}

/* ---- news, video and exhibition cards: text area in the navy / yellow-edge scheme (photos, logos and thumbnails untouched) ---- */
article.ncard .ncard-body,.doc-video .doc-body,.excard .ex-body{position:relative;overflow:hidden;background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);color:#fff;transition:background .25s var(--ease)}
article.ncard .ncard-body::before,.doc-video .doc-body::before,.excard .ex-body::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:var(--signal)}
article.ncard .ncard-body::after,.doc-video .doc-body::after,.excard .ex-body::after{content:"";position:absolute;right:-34px;top:-30px;bottom:-30px;width:140px;background:rgba(255,255,255,.07);transform:skewX(-14deg);pointer-events:none}
article.ncard .ncard-body>*,.doc-video .doc-body>*,.excard .ex-body>*{position:relative;z-index:1}
article.ncard:hover .ncard-body,article.ncard:focus-within .ncard-body,.doc-video:hover .doc-body,.excard:hover .ex-body{background:linear-gradient(135deg,#1f3151 0%,#2e4a77 100%)}
article.ncard .ncard-body{padding:16px 20px 20px 28px}
article.ncard time{color:#aebdcb}
article.ncard h3,article.ncard h3 a{color:#fff}
article.ncard .ex{color:#c4d0dc}
.doc-video .doc-body{padding-left:24px}
.doc-video .doc-body strong{color:#fff}
.doc-video .doc-body .dl{color:var(--signal)}
.excard .ex-body{flex:1;padding-left:28px}
.excard .ex-body time{color:var(--signal)}
.excard .ex-body h3{color:#fff}
.excard .ex-body p{color:#c4d0dc}
.excard .ex-body .dl{color:var(--signal)}
/* rental card: city line in yellow */
.rc-city{color:var(--signal);font-weight:600}
/* news cards: the navy text area fills the whole card height */
article.ncard{display:flex;flex-direction:column}
article.ncard .ncard-body{flex:1}

/* ---- news article ---- */
.art-head{padding-bottom:30px}
.art-meta{display:flex;align-items:center;gap:14px;margin:6px 0 10px}
.art-tag{display:inline-block;padding:4px 14px 4px 12px;background:var(--signal);color:#141618;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;transform:skewX(-14deg)}
.art-meta time{color:var(--muted);font-size:.9rem;letter-spacing:.03em}
.art-head h1{position:relative;max-width:20em;padding-left:.34em;font-size:clamp(2rem,4.6vw,3.4rem);line-height:1.1}
.art-head h1::before{content:"";position:absolute;left:0;top:.12em;bottom:.12em;width:.1em;background:var(--signal);transform:skewX(-14deg)}
.art-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:52px;align-items:start}
.art-body{max-width:none;min-width:0}
.art-body>p,.art-body>ul,.art-body>ol,.art-body>h2,.art-body>h3,.art-body>h4{max-width:46em}
.art-body p{font-size:1.06rem;line-height:1.75}
.art-body h2,.art-body h3{position:relative;padding-left:.7em;margin-top:1.8em}
.art-body h2::before,.art-body h3::before{content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:.22em;background:var(--signal);transform:skewX(-14deg)}
.art-body a{text-underline-offset:3px}
.art-body img{max-width:100%;height:auto;border-radius:14px;box-shadow:0 14px 34px -20px rgba(0,0,0,.55)}
.art-body .video{border-radius:14px;box-shadow:0 14px 34px -20px rgba(0,0,0,.55);max-width:760px}
.art-body blockquote{max-width:46em;margin:1.6em 0;padding:20px 26px 20px 30px;border:0;border-left:7px solid var(--signal);border-radius:12px;background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);color:#fff;font-size:1.15rem}
.art-body blockquote cite{color:#c4d0dc}
.art-back{margin-top:2.2em}
.art-side{position:sticky;top:96px;display:grid;gap:18px}
.art-card{position:relative;overflow:hidden;padding:22px 22px 22px 30px;border-radius:14px;background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);color:#fff;border:2px solid #1a2940}
.art-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:var(--signal)}
.art-card::after{content:"";position:absolute;right:-34px;top:-24px;bottom:-24px;width:130px;background:rgba(255,255,255,.07);transform:skewX(-14deg);pointer-events:none}
.art-card>*{position:relative;z-index:1}
.art-card h2{margin:0 0 .6rem;font-size:1.15rem;color:#fff}
.art-card p{margin:0 0 1rem;color:#c4d0dc;line-height:1.5;font-size:.95rem}
.art-card ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.art-card li a{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-top:1px solid rgba(255,255,255,.14);color:#fff;text-decoration:none;font-weight:600}
.art-card li:first-child a{border-top:0}
.art-card li a span{color:var(--signal);transition:transform .2s}.art-card li a:hover span{transform:translateX(4px)}
.art-link{display:inline-block;margin-top:14px;color:var(--signal);font-weight:600;text-decoration:none}.art-link:hover{text-decoration:underline}
@media (max-width:1020px){.art-grid{grid-template-columns:1fr;gap:32px}.art-side{position:static}}

.news-grid.art-more{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.news-grid.art-more{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}}

/* ===== light variant (two soft grays, yellow edge, navy text) for news, rental, exhibition, video cards and the article boxes; the navy scheme stays on product cards ===== */
:root{--lt-a:#f4f6f8;--lt-b:#dfe4ea;--lt-a2:#fafbfc;--lt-b2:#e7ebf0;--lt-ink:#1a2940;--lt-sub:#44566c;--lt-amber:#7a5f00}
/* news, video cards (download groups) and exhibition cards: text area */
article.ncard .ncard-body,.doc-video .doc-body,.excard .ex-body{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink)}
article.ncard .ncard-body::after,.doc-video .doc-body::after,.excard .ex-body::after{background:rgba(255,255,255,.6)}
article.ncard:hover .ncard-body,article.ncard:focus-within .ncard-body,.doc-video:hover .doc-body,.excard:hover .ex-body{background:linear-gradient(135deg,var(--lt-a2) 0%,var(--lt-b2) 100%)}
article.ncard time{color:var(--lt-sub)}
article.ncard h3,article.ncard h3 a{color:var(--lt-ink)}
article.ncard .ex{color:var(--lt-sub)}
.doc-video .doc-body strong{color:var(--lt-ink)}
.doc-video .doc-body .dl{color:var(--lt-amber)}
.excard .ex-body time{color:var(--lt-amber)}
.excard .ex-body h3{color:var(--lt-ink)}
.excard .ex-body p{color:var(--lt-sub)}
.excard .ex-body .dl{color:var(--lt-ink)}
/* rental cards */
article.rcard{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink);box-shadow:0 1px 2px rgba(20,22,24,.06),0 12px 26px -20px rgba(20,22,24,.45)}
article.rcard::after{background:rgba(255,255,255,.6)}
article.rcard:hover,article.rcard.on{background:linear-gradient(135deg,var(--lt-a2) 0%,var(--lt-b2) 100%)}
.rc-eyebrow{color:var(--lt-amber)}
.rc-name,.rc-name a{color:var(--lt-ink)}
.rc-city{color:var(--lt-sub);font-weight:600}.rc-city svg{color:var(--lt-amber)}
article.rcard .eq i{color:var(--lt-ink);border-color:rgba(26,41,64,.28);background:rgba(255,255,255,.65)}
.rc-act{color:var(--lt-ink);border-color:rgba(26,41,64,.4)}
.rc-act:hover,.rc-act:focus-visible{background:var(--signal);border-color:var(--signal);color:#141618}
article.rcard .go{color:var(--lt-ink)}
/* article page boxes */
.art-card{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink);border-color:#cfd6de}
.art-card::after{background:rgba(255,255,255,.6)}
.art-card h2{color:var(--lt-ink)}
.art-card p{color:var(--lt-sub)}
.art-card li a{color:var(--lt-ink);border-top-color:rgba(26,41,64,.15)}
.art-card li a span{color:var(--lt-amber)}
.art-link{color:var(--lt-ink);text-decoration:underline;text-underline-offset:3px}
.art-body blockquote{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink)}
.art-body blockquote cite{color:var(--lt-sub)}
.rc-city span{color:var(--lt-sub);font-size:.92rem}
/* dark theme: the original navy card scheme returns */
:root[data-theme=dark]{--lt-a:#1a2940;--lt-b:#27406a;--lt-a2:#203353;--lt-b2:#2f4d7e;--lt-ink:#fff;--lt-sub:#c4d0dc;--lt-amber:#FFE81A}
:root[data-theme=dark] article.ncard .ncard-body::after,:root[data-theme=dark] .doc-video .doc-body::after,:root[data-theme=dark] .excard .ex-body::after,:root[data-theme=dark] article.rcard::after,:root[data-theme=dark] .art-card::after{background:rgba(255,255,255,.07)}
:root[data-theme=dark] article.rcard .eq i{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.1)}
:root[data-theme=dark] .rc-act{border-color:rgba(255,255,255,.45)}
:root[data-theme=dark] .art-card{border-color:#1a2940}
:root[data-theme=dark] .art-card li a{border-top-color:rgba(255,255,255,.14)}
:root[data-theme=dark] .art-link{text-decoration:none}
@media (prefers-color-scheme:dark){
:root:not([data-theme=light]){--lt-a:#1a2940;--lt-b:#27406a;--lt-a2:#203353;--lt-b2:#2f4d7e;--lt-ink:#fff;--lt-sub:#c4d0dc;--lt-amber:#FFE81A}
:root:not([data-theme=light]) article.ncard .ncard-body::after,:root:not([data-theme=light]) .doc-video .doc-body::after,:root:not([data-theme=light]) .excard .ex-body::after,:root:not([data-theme=light]) article.rcard::after,:root:not([data-theme=light]) .art-card::after{background:rgba(255,255,255,.07)}
:root:not([data-theme=light]) article.rcard .eq i{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.1)}
:root:not([data-theme=light]) .rc-act{border-color:rgba(255,255,255,.45)}
:root:not([data-theme=light]) .art-card{border-color:#1a2940}
:root:not([data-theme=light]) .art-card li a{border-top-color:rgba(255,255,255,.14)}
:root:not([data-theme=light]) .art-link{text-decoration:none}
}

/* light theme: no extra amber, use the brand navy */
:root{--lt-amber:#1a2940}
:root[data-theme=dark]{--lt-amber:#FFE81A}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--lt-amber:#FFE81A}}
/* contact page: the four route cards use the light variant (navy again in the dark theme) */
a.routecard .prodcard-body{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink)}
a.routecard .prodcard-body::after{background:rgba(255,255,255,.6)}
a.routecard:hover .prodcard-body,a.routecard:focus-visible .prodcard-body{background:linear-gradient(135deg,var(--lt-a2) 0%,var(--lt-b2) 100%)}
a.routecard .prodcard-body h3{color:var(--lt-ink)}
a.routecard .prodcard-body p{color:var(--lt-sub)}
a.routecard .prodcard-foot{border-top-color:rgba(26,41,64,.18)}
a.routecard .prodcard-foot>span:first-child{color:var(--lt-ink)}
:root[data-theme=dark] a.routecard .prodcard-body::after{background:rgba(255,255,255,.07)}
:root[data-theme=dark] a.routecard .prodcard-foot{border-top-color:rgba(255,255,255,.18)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) a.routecard .prodcard-body::after{background:rgba(255,255,255,.07)}:root:not([data-theme=light]) a.routecard .prodcard-foot{border-top-color:rgba(255,255,255,.18)}}
/* top row: pale header with navy text in the light theme (dark theme keeps the original) */
:root[data-theme=light] .site-header{background:linear-gradient(90deg,#ffffff 0%,#e9eff6 100%);border-bottom:3px solid var(--signal);backdrop-filter:none}
:root[data-theme=light] .site-header .main-nav a{color:#1a2940}
:root[data-theme=light] .site-header .main-nav a:hover{color:#2e4a77}
:root[data-theme=light] .site-header .icon-btn{color:#1a2940;border-color:rgba(26,41,64,.3)}
:root[data-theme=light] .site-header .icon-btn:hover{border-color:#1a2940}
:root[data-theme=light] .site-header .bar-end .btn{background:var(--signal);color:#141618}
@media (prefers-color-scheme:light){
:root:not([data-theme=dark]) .site-header{background:linear-gradient(90deg,#ffffff 0%,#e9eff6 100%);border-bottom:3px solid var(--signal);backdrop-filter:none}
:root:not([data-theme=dark]) .site-header .main-nav a{color:#1a2940}
:root:not([data-theme=dark]) .site-header .main-nav a:hover{color:#2e4a77}
:root:not([data-theme=dark]) .site-header .icon-btn{color:#1a2940;border-color:rgba(26,41,64,.3)}
:root:not([data-theme=dark]) .site-header .icon-btn:hover{border-color:#1a2940}
:root:not([data-theme=dark]) .site-header .bar-end .btn{background:var(--signal);color:#141618}
}
/* contrast fixes found in the audit */
.ncard-art small{color:#b9c8d0}
.req{color:#c0332b}
:root[data-theme=dark] .req{color:#ff7a70}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .req{color:#ff7a70}}

/* light theme: download cards use the light card pattern (dark theme unchanged) */
:root[data-theme=light] .doc:not(.doc-video) .dart{background:linear-gradient(135deg,#f4f6f8 0%,#dfe4ea 100%);color:#27406a}
:root[data-theme=light] .doc:not(.doc-video) .dart.bp{background:linear-gradient(135deg,#f4f6f8 0%,#d9e0e8 100%)}
:root[data-theme=light] .doc:not(.doc-video) .dart.bp::before{background-image:linear-gradient(rgba(39,64,106,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(39,64,106,.1) 1px,transparent 1px)}
:root[data-theme=light] .doc:not(.doc-video) .dart::after{background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.15))}
:root[data-theme=light] .doc:not(.doc-video) .dart-ico{color:#27406a;filter:drop-shadow(0 2px 6px rgba(26,41,64,.12))}
:root[data-theme=light] .doc:not(.doc-video) .dart-txt{background:linear-gradient(0deg,rgba(223,228,234,.96),rgba(223,228,234,0))}
:root[data-theme=light] .doc:not(.doc-video) .dart-txt small{color:#44566c}
:root[data-theme=light] .doc:not(.doc-video) .dart-txt b{color:#1a2940}
:root[data-theme=light] .doc:not(.doc-video) .dart-txt span{color:#44566c}
:root[data-theme=light] .doc:not(.doc-video) .doc-body{position:relative;padding-left:24px;background:linear-gradient(135deg,#f4f6f8 0%,#dfe4ea 100%);color:#1a2940}
:root[data-theme=light] .doc:not(.doc-video) .doc-body::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:var(--signal)}
:root[data-theme=light] .doc:not(.doc-video) .doc-body strong{color:#1a2940}
:root[data-theme=light] .doc:not(.doc-video) .doc-body small{color:#44566c}
:root[data-theme=light] .doc:not(.doc-video):hover .doc-body{background:linear-gradient(135deg,#fafbfc 0%,#e7ebf0 100%)}
@media (prefers-color-scheme:light){
:root:not([data-theme=dark]) .doc:not(.doc-video) .dart{background:linear-gradient(135deg,#f4f6f8 0%,#dfe4ea 100%);color:#27406a}
:root:not([data-theme=dark]) .doc:not(.doc-video) .dart.bp{background:linear-gradient(135deg,#f4f6f8 0%,#d9e0e8 100%)}
:root:not([data-theme=dark]) .doc:not(.doc-video) .dart.bp::before{background-image:linear-gradient(rgba(39,64,106,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(39,64,106,.1) 1px,transparent 1px)}
:root:not([data-theme=dark]) .doc:not(.doc-video) .dart::after{background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.15))}
:root:not([data-theme=dark]) .doc:not(.doc-video) .dart-ico{color:#27406a;filter:drop-shadow(0 2px 6px rgba(26,41,64,.12))}
:root:not([data-theme=dark]) .doc:not(.doc-video) .dart-txt{background:linear-gradient(0deg,rgba(223,228,234,.96),rgba(223,228,234,0))}
:root:not([data-theme=dark]) .doc:not(.doc-video) .dart-txt small{color:#44566c}
:root:not([data-theme=dark]) .doc:not(.doc-video) .dart-txt b{color:#1a2940}
:root:not([data-theme=dark]) .doc:not(.doc-video) .dart-txt span{color:#44566c}
:root:not([data-theme=dark]) .doc:not(.doc-video) .doc-body{position:relative;padding-left:24px;background:linear-gradient(135deg,#f4f6f8 0%,#dfe4ea 100%);color:#1a2940}
:root:not([data-theme=dark]) .doc:not(.doc-video) .doc-body::before{content:"";position:absolute;left:0;top:0;bottom:0;width:7px;background:var(--signal)}
:root:not([data-theme=dark]) .doc:not(.doc-video) .doc-body strong{color:#1a2940}
:root:not([data-theme=dark]) .doc:not(.doc-video) .doc-body small{color:#44566c}
:root:not([data-theme=dark]) .doc:not(.doc-video):hover .doc-body{background:linear-gradient(135deg,#fafbfc 0%,#e7ebf0 100%)}
}

/* ===== mobile: bigger type, taller header, full-screen menu ===== */
.nav-cta{display:none}
.menu-btn .m-close{display:none}.menu-btn[aria-expanded=true] .m-open{display:none}.menu-btn[aria-expanded=true] .m-close{display:inline}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (max-width:960px){
  :root{--hh:70px}
  .bar{height:var(--hh);gap:10px}
  .brand img{height:30px}
  .site-header .icon-btn,.site-header .lang-btn,.site-header .lang>button{min-width:46px;height:46px}
  .site-header .icon-btn svg{width:22px;height:22px}
  .main-nav{position:fixed;top:var(--hh);left:0;right:0;bottom:0;overflow:auto;padding:8px 24px 32px;border-bottom:0;gap:0;z-index:60}
  .main-nav a{display:block;padding:18px 4px;font-size:1.4rem;font-weight:600;border-bottom:1px solid var(--line);color:var(--text)}
  .main-nav a[aria-current]{color:var(--heading)}
  .main-nav a[aria-current]::after{left:4px;right:auto;width:44px;bottom:8px}
  .main-nav .nav-cta{display:block;margin-top:22px;padding:16px 20px;border:0;border-radius:var(--r);background:var(--signal);color:#141618;text-align:center;font-size:1.15rem}
  body.nav-lock{overflow:hidden}
}
@media (max-width:760px){
  html{font-size:112.5%}
  .wrap{padding-left:20px;padding-right:20px}
  h1{font-size:clamp(2rem,9vw,2.6rem)}
  .prose p,.lead-sm,.lead{line-height:1.6}
  .chip,.cf-chip{font-size:.92rem}
  .foot-grid{grid-template-columns:1fr}
}
@media (max-width:960px){.site-header{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--bg)}}

/* chapter buttons on product pages */
.subnav{display:flex;gap:10px;overflow-x:auto;border-top:1px solid var(--line);margin-top:8px;padding:16px 0 18px;scrollbar-width:thin}
.subnav a{position:relative;flex:none;display:inline-flex;align-items:center;gap:9px;padding:10px 16px 10px 20px;margin:0;border:1.5px solid #cfd6de;border-radius:10px;background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink);font-weight:600;font-size:.95rem;text-decoration:none;overflow:hidden;transition:border-color .2s,box-shadow .2s,transform .2s}
.subnav a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--signal)}
.subnav a[data-n]::after{content:attr(data-n);display:inline-grid;place-items:center;min-width:1.6em;height:1.6em;padding:0 .4em;border-radius:99px;background:rgba(26,41,64,.12);font-size:.78rem;font-weight:700}
.subnav a:hover{border-color:var(--signal);transform:translateY(-2px);color:var(--lt-ink)}
.subnav a.on{border-color:var(--signal);box-shadow:0 0 0 1px var(--signal)}
:root[data-theme=dark] .subnav a{border-color:#1a2940}:root[data-theme=dark] .subnav a[data-n]::after{background:rgba(255,255,255,.14)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .subnav a{border-color:#1a2940}:root:not([data-theme=light]) .subnav a[data-n]::after{background:rgba(255,255,255,.14)}}
.dl-group,#photos,#videos,#downloads{scroll-margin-top:96px}

/* ===== product page: sticky tab bar (tabs of the old site) with animated buttons ===== */
.tabbar{position:sticky;top:72px;z-index:40;display:flex;flex-wrap:wrap;gap:10px 12px;padding:12px 2px 14px;margin:0 0 24px;background:var(--bg);border-bottom:1px solid var(--line)}
.tabbar::-webkit-scrollbar{display:none}
.tabbar a[role=tab]{position:relative;flex:none;display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:4px;color:var(--heading);font-weight:700;font-size:.98rem;text-decoration:none;white-space:nowrap;box-shadow:inset 0 0 0 2px currentColor;background:linear-gradient(105deg,var(--signal) 0 50%,transparent 50%) 100% 0/260% 100% no-repeat;transition:background-position .5s var(--ease),color .2s,transform .2s,box-shadow .2s}
.tabbar a[role=tab]::before{content:"";width:20px;height:20px;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat;transition:transform .35s var(--ease)}
.tabbar a[role=tab]::after{content:attr(data-n);display:inline-grid;place-items:center;min-width:1.7em;height:1.7em;padding:0 .45em;border-radius:99px;background:rgba(26,41,64,.14);font-size:.78rem;font-weight:700;transition:background .2s,color .2s}
.tabbar a[role=tab]:hover{background-position:0 0;color:#141618;transform:translateY(-2px)}
.tabbar a[role=tab]:hover::before{transform:rotate(-8deg) scale(1.15)}
.tabbar a[role=tab][aria-selected=true]{background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);color:#fff;box-shadow:inset 0 0 0 2px #1a2940,inset 0 -4px 0 var(--signal);transform:none}
.tabbar a[role=tab][aria-selected=true]::before{background:var(--signal);animation:tabpop .45s var(--ease)}
.tabbar a[role=tab][aria-selected=true]::after{background:var(--signal);color:#141618}
@keyframes tabpop{0%{transform:scale(.6) rotate(-20deg)}70%{transform:scale(1.2)}100%{transform:none}}
:root[data-theme=dark] .tabbar a[role=tab]::after{background:rgba(255,255,255,.16)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .tabbar a[role=tab]::after{background:rgba(255,255,255,.16)}}
:root[data-theme=dark] .tabbar a[role=tab][aria-selected=true]::after{background:var(--signal)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .tabbar a[role=tab][aria-selected=true]::after{background:var(--signal)}}
.tabbar a[data-i=gallery]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%274%27%20width%3D%2718%27%20height%3D%2716%27%20rx%3D%272%27%2F%3E%3Ccircle%20cx%3D%279%27%20cy%3D%2710%27%20r%3D%271.6%27%2F%3E%3Cpath%20d%3D%27M3%2017l5-5%204%204%203-3%206%206%27%2F%3E%3C%2Fsvg%3E")}
.tabbar a[data-i=price]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2012V4h8l10%2010-8%208z%27%2F%3E%3Ccircle%20cx%3D%277.5%27%20cy%3D%278.5%27%20r%3D%271.3%27%2F%3E%3C%2Fsvg%3E")}
.tabbar a[data-i=manual]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%205a2%202%200%20012-2h13v16H6a2%202%200%2000-2%202z%27%2F%3E%3Cpath%20d%3D%27M8%207h8M8%2011h8%27%2F%3E%3C%2Fsvg%3E")}
.tabbar a[data-i=drawing]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2017L17%203l4%204L7%2021z%27%2F%3E%3Cpath%20d%3D%27M7%2013l2%202M10%2010l2%202M13%207l2%202%27%2F%3E%3C%2Fsvg%3E")}
.tabbar a[data-i=specs]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%274%27%20y%3D%273%27%20width%3D%2716%27%20height%3D%2718%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27M4%209h16M4%2015h16M10%209v12%27%2F%3E%3C%2Fsvg%3E")}
.tabbar a[data-i=tools]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M8%208l-5%204%205%204M16%208l5%204-5%204M14%205l-4%2014%27%2F%3E%3C%2Fsvg%3E")}
.tabbar a[data-i=tracking]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%278%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%273%27%2F%3E%3Cpath%20d%3D%27M12%202v4M12%2018v4M2%2012h4M18%2012h4%27%2F%3E%3C%2Fsvg%3E")}
.ptabs.tabs-on .tpanel{display:none}
.ptabs.tabs-on .tpanel.on{display:block;animation:tabin .4s var(--ease)}
@keyframes tabin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.tp-h{margin:0 0 14px;font-size:1.2rem}.tp-h:not(:first-child){margin-top:36px}
@media (max-width:960px){.tabbar{top:74px;margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px;gap:8px}.tabbar a[role=tab]{padding:10px 14px;font-size:.92rem}}
/* product header: the video fills the free area next to the description (taller column, cropped to fit) */
.ph-grid:not(.solo){grid-template-columns:minmax(0,.82fr) minmax(0,1.3fr);gap:44px;align-items:stretch}
.ph-grid:not(.solo)>div:first-child{align-self:center}
.ph-vid{display:flex;min-height:380px}
.ph-vid .video{flex:1;width:100%;height:auto;min-height:380px;aspect-ratio:auto}
.ph-vid .video>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:960px){.ph-grid:not(.solo){grid-template-columns:1fr;gap:28px}.ph-vid{min-height:0}.ph-vid .video{min-height:0;aspect-ratio:16/9;height:auto}}
/* product header, final: video keeps its 16:9 ratio and takes the wider column; the text column keeps its own height */
.ph-grid:not(.solo){grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:44px;align-items:center}
.ph-grid:not(.solo)>div:first-child{align-self:center}
.ph-vid{display:block;min-height:0}
.ph-vid .video{width:100%;height:auto;min-height:0;aspect-ratio:16/9}
.ph-vid .video>img{position:static;width:100%;height:100%;object-fit:cover}
/* news cards: every card the same height (the height of the top row); long titles and teasers are cut with an ellipsis */
article.ncard .ncard-body{height:209px;flex:none;box-sizing:border-box}
article.ncard h3{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
article.ncard .ex{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* contact: five route cards (the odd last one spans the row on tablets); #team scrolls clear of the header */
@media (min-width:561px) and (max-width:1020px){.routes>:last-child:nth-child(odd){grid-column:1/-1}}
#team{scroll-margin-top:72px}
/* team cards on phones: a big portrait next to the name, contact lines and button under it at full width */
@media (max-width:560px){
  .bcard{grid-template-columns:minmax(0,1fr) 47%;grid-template-rows:auto auto 1fr auto;min-height:0;align-items:stretch}
  .bc-body{display:contents}
  .bcard h3{grid-column:1;grid-row:1;align-self:end;position:relative;z-index:2;padding:22px 0 0 24px;font-size:1.3rem}
  .bcard .role{grid-column:1;grid-row:2;align-self:start;position:relative;z-index:2;padding:0 0 0 24px;margin:.35rem 0 0}
  .bc-photo{grid-column:2;grid-row:1 / span 2;align-self:end;justify-self:end;width:100%;order:0}
  .bc-photo img{width:100%;height:auto;max-height:none;object-fit:contain}
  .bcard.nocut .bc-photo img{margin:0 0 6px}
  .bc-lines{grid-column:1 / -1;grid-row:3;position:relative;z-index:2;padding:12px 18px 0 24px;margin:0;font-size:.9rem}
  .bcard .btn{grid-column:1 / -1;grid-row:4;position:relative;z-index:2;justify-self:start;margin:14px 0 20px 24px}
}
/* download cards: the picture already carries type, crane and name, so the text below only keeps date, size and the download line (title stays for screen readers) */
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.doc .doc-body{padding-top:16px}
/* download cards: same split as the video cards (picture area 4:3, text area below); the icon sits in the upper part so a two-line name never touches it */
.doc-thumb.is-art{aspect-ratio:4/3}
.dart-ico{top:30%;width:auto;height:40%;max-width:58%}
.dart-txt b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dart-txt span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc:not(.doc-video) .doc-body{flex:none;min-height:96px;justify-content:space-between}
.doc:not(.doc-video) .doc-body .dl{margin-top:auto}
/* the text area of a download card always fills the card down to its bottom edge (no empty strip when a neighbouring card in the row is taller) */
.doc:not(.doc-video) .doc-body{flex:1 1 auto}
/* ===== brand lockups (Wordmark Design Manual REV 06): italic two-tone word in a slanted yellow frame; TECHNO / SUPER... reverse to white on the dark theme ===== */
.lockup{--u:.62px;--w:560.15;--l:32.69;position:relative;display:inline-block;width:calc(var(--w)*var(--u));height:calc(100.45*var(--u));font:italic 400 calc(74*var(--u))/calc(93.2*var(--u)) Barlow,Helvetica,Arial,sans-serif;letter-spacing:-.01em;text-transform:uppercase;white-space:nowrap;color:#33465A;vertical-align:middle}
.lockup b{font-weight:600;color:#93A7B0}
.lockup::before{content:"";position:absolute;inset:0;border:calc(7.25*var(--u)) solid #FFE81A;border-radius:calc(50.2*var(--u));transform:skewX(-14deg)}
.lockup .t{position:absolute;left:calc(var(--l)*var(--u));top:0}
.lockup.td{--w:549.91;--l:32.69}.lockup.st{--w:552.91;--l:37.31}
:root[data-theme=dark] .lockup{color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .lockup{color:#fff}}
.logo-set{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin:1.6em 0 2em;padding:0;list-style:none}
.logo-set figure{margin:0;padding:26px 18px 16px;border-radius:14px;border:1.5px solid var(--line);background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);text-align:center}
.logo-set figcaption{margin-top:12px;font-size:.9rem;color:var(--muted)}
:root[data-theme=dark] .logo-set figure{background:#141618;border-color:#33465A}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .logo-set figure{background:#141618;border-color:#33465A}}
@media (max-width:560px){.lockup{--u:.5px}}

/* product header buttons: same look and motion as the section tabs (icon, slanted sweep on hover, navy pressed state) */
.cta-row .btn[data-i]{position:relative;display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:4px;font-weight:700;text-decoration:none;white-space:nowrap;overflow:hidden;transition:background-position .5s var(--ease),color .2s,transform .2s,box-shadow .2s}
.cta-row .btn[data-i]::before{content:"";width:20px;height:20px;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat;transition:transform .35s var(--ease)}
.cta-row .btn[data-i=quote]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%275%27%20width%3D%2718%27%20height%3D%2714%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27m3%207%209%206%209-6%27%2F%3E%3C%2Fsvg%3E")}
.cta-row .btn[data-i=rental]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2021s-7-6.2-7-11a7%207%200%200114%200c0%204.8-7%2011-7%2011z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2710%27%20r%3D%272.5%27%2F%3E%3C%2Fsvg%3E")}
.cta-row .btn-ghost[data-i]{color:var(--heading);box-shadow:inset 0 0 0 2px currentColor;background:linear-gradient(105deg,var(--signal) 0 50%,transparent 50%) 100% 0/260% 100% no-repeat}
.cta-row .btn-signal[data-i]{color:#141618;box-shadow:none;background:linear-gradient(105deg,#1a2940 0 50%,transparent 50%) 100% 0/260% 100% no-repeat,var(--signal)}
.cta-row .btn[data-i]:hover{background-position:0 0,0 0;transform:translateY(-2px)}
.cta-row .btn-ghost[data-i]:hover{color:#141618}
.cta-row .btn-signal[data-i]:hover{color:#fff}
.cta-row .btn[data-i]:hover::before{transform:rotate(-8deg) scale(1.15)}
.cta-row .btn[data-i]:active,.cta-row .btn[data-i]:focus-visible{background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);color:#fff;transform:none;box-shadow:inset 0 0 0 2px #1a2940,inset 0 -4px 0 var(--signal);outline:0}
.cta-row .btn[data-i]:active::before,.cta-row .btn[data-i]:focus-visible::before{background:var(--signal);animation:tabpop .45s var(--ease)}
/* logo tiles: the lockup scales with its tile so it never overflows on narrow screens */
.logo-set figure{container-type:inline-size}
.logo-set .lockup{--u:min(.62px,.155cqw)}

/* ===== legal pages (Terms and Privacy): same language as the rest of the site – Barlow, yellow slanted marks, light cards ===== */
.legal{font-size:1.02rem;line-height:1.75;color:var(--text)}
.legal.narrow{max-width:900px}
.legal h3,.legal h4{position:relative;margin:2.2em 0 .6em;padding-left:.75em;font-size:1.3rem;line-height:1.25;color:var(--heading)}
.legal h3::before,.legal h4::before{content:"";position:absolute;left:0;top:.14em;bottom:.14em;width:.24em;background:var(--signal);transform:skewX(-14deg)}
.legal ul{list-style:none;padding:0;margin:1em 0}
.legal ul>li{position:relative;margin:0 0 .7em;padding:.1em 0 .1em 1.5em}
.legal ul>li::before{content:"";position:absolute;left:.1em;top:.62em;width:.5em;height:.8em;background:var(--signal);transform:skewX(-14deg) translateY(-.1em)}
.legal a{color:var(--heading);text-decoration-color:var(--signal);text-decoration-thickness:2px;text-underline-offset:3px}.legal a:hover{background:var(--signal);color:#141618;text-decoration:none}
.legal strong{color:var(--heading)}
/* Terms and Conditions: numbered sections */
.terms .tc-head{margin:0 0 1.2rem}
.terms .tc-co{display:inline-block;margin:0;padding:.35em 1em .35em .9em;background:var(--signal);color:#141618;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.82rem;transform:skewX(-14deg)}
.terms .tc-co{box-shadow:none}
.tc-toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 2.2rem;padding:16px;border-radius:14px;background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);border:1.5px solid var(--line)}
.tc-toc a{display:inline-flex;align-items:center;gap:8px;padding:7px 13px 7px 8px;border-radius:6px;background:#fff;color:#1a2940;font-weight:600;font-size:.9rem;line-height:1.2;text-decoration:none;box-shadow:inset 0 0 0 1.5px rgba(26,41,64,.18);transition:box-shadow .2s,transform .2s}
.tc-toc a b{display:inline-grid;place-items:center;min-width:1.7em;height:1.7em;border-radius:99px;background:var(--signal);color:#141618;font-size:.78rem}
.tc-toc a:hover{background:#fff;color:#1a2940;box-shadow:inset 0 0 0 2px var(--signal);transform:translateY(-2px)}
.tc-list{display:grid;gap:0}
.tc-sec{display:grid;grid-template-columns:62px minmax(0,1fr);gap:0 18px;padding:26px 0;border-top:1.5px solid var(--line);scroll-margin-top:90px}
.tc-sec:first-child{border-top:0;padding-top:6px}
.tc-num{position:relative;width:46px;height:46px;display:grid;place-items:center;font-weight:700;font-size:1.15rem;color:#141618}
.tc-num::before{content:"";position:absolute;inset:0;background:var(--signal);transform:skewX(-14deg)}
.tc-num span{position:relative}
.tc-body h2{margin:.35em 0 .6em;font-size:1.45rem;line-height:1.2;color:var(--heading)}
.tc-body p{margin:0 0 1em}
.tc-body p.tc-caps{padding:14px 18px 14px 20px;border-left:5px solid var(--signal);border-radius:0 8px 8px 0;background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink);font-size:.9rem;line-height:1.6;letter-spacing:.01em}
.tc-sub{counter-reset:s;list-style:none;margin:1.2em 0 0;padding:0;display:grid;gap:12px}
.tc-sub>li{counter-increment:s;position:relative;margin:0;padding:16px 18px 6px 62px;border-radius:12px;border:1.5px solid var(--line);background:var(--card,transparent)}
.tc-sub>li::before{content:counter(s,lower-alpha);position:absolute;left:16px;top:16px;width:30px;height:30px;display:grid;place-items:center;font-weight:700;font-size:.95rem;line-height:1;color:#141618;background:var(--signal);transform:skewX(-14deg);padding:0}
.tc-lead{display:block;margin:0 0 .35em;font-size:1.08rem;color:var(--heading)}
.tc-subtext p{margin:0 0 .9em}
@media (max-width:600px){.tc-sec{grid-template-columns:40px minmax(0,1fr);gap:0 12px}.tc-num{width:36px;height:36px;font-size:1rem}.tc-body h2{font-size:1.25rem}.tc-sub>li{padding:14px 14px 4px 54px}.tc-sub>li::before{left:12px;top:14px}}
/* phones: the portraits keep their natural position (no desktop scaling) and leave a little headroom, so no head touches or crosses the card's top edge */
@media (max-width:560px){
  .bc-photo{padding-top:14px;box-sizing:border-box}
  .bcard{overflow:hidden}
}

/* portraits: every cut-out is scaled (from its bottom edge) so the head sits at the same height as on Tomas Kohler's card (1331); Josh Bumgarner's photo already touches its top edge, so it keeps its size */
.bcard[data-pid="1313"] .bc-photo img{transform:scale(1.057);transform-origin:50% 100%}
.bcard[data-pid="1314"] .bc-photo img{transform:scale(1.117);transform-origin:50% 100%}
.bcard[data-pid="1316"] .bc-photo img{transform:scale(1.045);transform-origin:50% 100%}
.bcard[data-pid="1331"] .bc-photo img{transform:scale(1.12);transform-origin:50% 100%}
.bcard[data-pid="1333"] .bc-photo img{transform:scale(1.123);transform-origin:50% 100%}
.bcard[data-pid="2091"] .bc-photo img{transform:scale(1);transform-origin:50% 100%}
.bcard[data-pid="2356"] .bc-photo img{transform:scale(1.117);transform-origin:50% 100%}
.bcard[data-pid="2357"] .bc-photo img{transform:scale(1.1);transform-origin:50% 100%}

/* Academy: construction notice on top, play button for visitors whose device asks for reduced motion */
.ac-notice{background:var(--signal);color:#141618;border-bottom:3px solid #141618}
.ac-notice .wrap{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:11px;padding-bottom:11px}
.ac-notice p{margin:0;font-size:1.02rem;letter-spacing:.01em}
.ac-notice-ico{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#141618;color:var(--signal);font-weight:800;font-size:.95rem;line-height:1}
.ac-hero-play{position:absolute;right:24px;bottom:24px;z-index:3}
/* Josh Bumgarner's photo is cropped at the top of the hair in the original; a soft fade on that edge makes it read as a natural edge instead of a hard cut */
.bcard[data-pid="2091"] .bc-photo img{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 9%);mask-image:linear-gradient(to bottom,transparent 0,#000 9%)}

/* ===== all cards: no yellow strip on the left; product cards use the same gray card design as news / rental / exhibition cards (navy in the dark theme) ===== */
.bcard::before,a.prodcard .prodcard-body::before,article.ncard .ncard-body::before,.doc-video .doc-body::before,.excard .ex-body::before,article.rcard::before,.art-card::before,.pc-head::before,
:root[data-theme=light] .doc:not(.doc-video) .doc-body::before,:root:not([data-theme=dark]) .doc:not(.doc-video) .doc-body::before{display:none}
/* the left padding that made room for the strip */
article.ncard .ncard-body{padding-left:22px}.doc-video .doc-body{padding-left:20px}.excard .ex-body{padding-left:22px}
a.prodcard .prodcard-body{padding-left:20px}
.doc:not(.doc-video) .doc-body{padding-left:20px}
article.rcard{padding-left:22px}.art-card{padding-left:24px}.bc-body{padding-left:24px}
.pc-head{padding-left:30px}
/* product cards: light gray gradient (theme-aware variables), navy text */
a.prodcard .prodcard-body{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink)}
a.prodcard .prodcard-body::after{background:rgba(255,255,255,.6)}
a.prodcard:hover .prodcard-body,a.prodcard:focus-visible .prodcard-body{background:linear-gradient(135deg,var(--lt-a2) 0%,var(--lt-b2) 100%)}
a.prodcard .prodcard-body h3{color:var(--lt-ink)}
a.prodcard .prodcard-body p{color:var(--lt-sub)}
a.prodcard .prodcard-foot{border-top-color:rgba(26,41,64,.18)}
a.prodcard .prodcard-foot>span:first-child{color:var(--lt-ink)}
a.prodcard .prodcard-go{color:var(--lt-ink)}
:root[data-theme=dark] a.prodcard .prodcard-body::after{background:rgba(255,255,255,.07)}
:root[data-theme=dark] a.prodcard .prodcard-foot{border-top-color:rgba(255,255,255,.18)}
:root[data-theme=dark] a.prodcard .prodcard-go{color:var(--signal)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) a.prodcard .prodcard-body::after{background:rgba(255,255,255,.07)}:root:not([data-theme=light]) a.prodcard .prodcard-foot{border-top-color:rgba(255,255,255,.18)}:root:not([data-theme=light]) a.prodcard .prodcard-go{color:var(--signal)}}

/* news cover cards (no photo/video): gray shading in the light theme, the dark cover stays on the dark theme */
:root[data-theme=light] .ncard-art{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:#1a2940}
:root[data-theme=light] .ncard-art.v1{background:linear-gradient(120deg,var(--lt-b) 0%,var(--lt-a) 60%,var(--lt-b2) 120%)}
:root[data-theme=light] .ncard-art.v2{background:linear-gradient(150deg,var(--lt-a2) 0%,var(--lt-b) 100%)}
:root[data-theme=light] .ncard-art::before{background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,.2))}
:root[data-theme=light] .art-frame{background:rgba(255,255,255,.6)}
:root[data-theme=light] .ncard-art small{color:#44566c}
@media (prefers-color-scheme:light){
:root:not([data-theme=dark]) .ncard-art{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:#1a2940}
:root:not([data-theme=dark]) .ncard-art.v1{background:linear-gradient(120deg,var(--lt-b) 0%,var(--lt-a) 60%,var(--lt-b2) 120%)}
:root:not([data-theme=dark]) .ncard-art.v2{background:linear-gradient(150deg,var(--lt-a2) 0%,var(--lt-b) 100%)}
:root:not([data-theme=dark]) .ncard-art::before{background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,.2))}
:root:not([data-theme=dark]) .art-frame{background:rgba(255,255,255,.6)}
:root:not([data-theme=dark]) .ncard-art small{color:#44566c}
}
/* home slider, lighter like the old website: a soft veil instead of a heavy dark one, the photo runs through to the bottom, the tab strip is transparent and all texts are white */
.vs-slide::before{background:linear-gradient(90deg,rgba(20,22,24,.5) 0%,rgba(20,22,24,.28) 45%,rgba(20,22,24,.1) 80%),linear-gradient(0deg,rgba(20,22,24,.22) 0%,rgba(20,22,24,0) 30%)}
.vs-tabs{background:transparent;border-top:1px solid rgba(255,255,255,.5)}
.vs-tab,.vs-tab:hover,.vs-tab.is-active{color:#fff}
.vs-tab{text-shadow:0 1px 10px rgba(0,0,0,.55)}
.vs-num{color:rgba(255,255,255,.88)}.vs-tab.is-active .vs-num{color:var(--signal)}
.vs-tt em{color:rgba(255,255,255,.92)}
.vs-copy,.vs-title,.vs-sub{text-shadow:0 2px 18px rgba(0,0,0,.45)}
/* news cover: no yellow divider line, no underline, gray fill behind the logo, frame proportions per Wordmark Design Manual (stroke 7.25, 36 clear each side of the ink, type 74 / frame 100.45) */
.ncard-art::after{display:none}
.art-frame{font-size:clamp(14px,7.4cqw,40px);border:.098em solid var(--signal);padding:.13em .44em;text-decoration:none}
.art-frame b{font-size:1em;line-height:1;letter-spacing:-.01em;text-transform:uppercase;text-decoration:none}
:root[data-theme=light] .art-frame{background:rgba(26,41,64,.07)}
:root:not([data-theme=dark]) .art-frame{background:rgba(26,41,64,.07)}
/* news cover: plain headline text (no logo frame), like the product-card titles */
.art-frame,:root[data-theme=light] .art-frame,:root:not([data-theme=dark]) .art-frame{border:0;background:none;padding:0;border-radius:0;transform:none;text-decoration:none}
.art-frame b{transform:none;font:700 clamp(18px,8cqw,40px)/1.1 var(--font);font-style:normal;letter-spacing:0;text-transform:none;text-decoration:none;white-space:normal;text-align:center;color:inherit}
.ncard-art,.ncard-art *{text-decoration:none!important}
.ncard-art .art-frame{display:inline-block}
/* news cover without photo: one continuous card – the slanted band runs unbroken from the text part up through the cover; headline in big bold italic */
article.ncard:has(.ncard-art){position:relative;overflow:hidden;background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%)}
article.ncard:has(.ncard-art) .ncard-art,article.ncard:has(.ncard-art) .ncard-body{background:none!important}
article.ncard:has(.ncard-art) .ncard-art::before{display:none}
article.ncard:has(.ncard-art) .ncard-body::after{display:none}
article.ncard:has(.ncard-art)::after{content:"";position:absolute;right:-34px;top:-30px;bottom:-30px;width:140px;background:rgba(255,255,255,.6);transform:skewX(-14deg);pointer-events:none;z-index:0}
article.ncard:has(.ncard-art)>*{position:relative;z-index:1}
:root[data-theme=dark] article.ncard:has(.ncard-art){background:linear-gradient(135deg,#1a2940 0%,#27406a 100%)}
:root[data-theme=dark] article.ncard:has(.ncard-art)::after{background:rgba(255,255,255,.07)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) article.ncard:has(.ncard-art){background:linear-gradient(135deg,#1a2940 0%,#27406a 100%)}:root:not([data-theme=light]) article.ncard:has(.ncard-art)::after{background:rgba(255,255,255,.07)}}
.art-frame b{font:italic 800 clamp(26px,12cqw,60px)/1.05 var(--font)!important;letter-spacing:-.01em}
/* light theme: rental strip and footer in shades of gray like the cards (strip darker, footer lighter) */
:root[data-theme=light] .cta-band,:root:not([data-theme=dark]) .cta-band{background:linear-gradient(135deg,#c9d1da 0%,#aeb9c5 100%);color:#1a2940}
:root[data-theme=light] .cta-band h2,:root:not([data-theme=dark]) .cta-band h2{color:#1a2940}
:root[data-theme=light] .band p,:root:not([data-theme=dark]) .band p{color:#34465c}
:root[data-theme=light] .site-footer,:root:not([data-theme=dark]) .site-footer{background:linear-gradient(135deg,#f4f6f8 0%,#dfe4ea 100%);color:#34465c}
:root[data-theme=light] .foot-grid h4,:root:not([data-theme=dark]) .foot-grid h4{color:#1a2940}
:root[data-theme=light] .foot-grid a,:root:not([data-theme=dark]) .foot-grid a{color:#34465c}
:root[data-theme=light] .foot-grid a:hover,:root:not([data-theme=dark]) .foot-grid a:hover{color:#1a2940}
:root[data-theme=light] .foot-base,:root:not([data-theme=dark]) .foot-base{border-top-color:rgba(26,41,64,.18);color:#44566c}
:root[data-theme=light] .foot-base a,:root:not([data-theme=dark]) .foot-base a{color:#44566c}
article.ncard:has(.ncard-art) .ncard-img{border-bottom:2px solid var(--signal)}
.ncard-img a,.ncard-img a:hover{text-decoration:none!important}
/* swapped: rental strip lighter, footer darker gray (light theme) */
:root[data-theme=light] .cta-band,:root:not([data-theme=dark]) .cta-band{background:linear-gradient(135deg,#f4f6f8 0%,#dfe4ea 100%)}
:root[data-theme=light] .site-footer,:root:not([data-theme=dark]) .site-footer{background:linear-gradient(135deg,#c9d1da 0%,#aeb9c5 100%);color:#1a2940}
:root[data-theme=light] .foot-grid a,:root:not([data-theme=dark]) .foot-grid a,:root[data-theme=light] .foot-base,:root:not([data-theme=dark]) .foot-base,:root[data-theme=light] .foot-base a,:root:not([data-theme=dark]) .foot-base a{color:#2a3b52}
:root[data-theme=light] .foot-base,:root:not([data-theme=dark]) .foot-base{border-top-color:rgba(26,41,64,.25)}
/* light theme footer: the pale blue-green of the original website */
:root[data-theme=light] .site-footer,:root:not([data-theme=dark]) .site-footer{background:#e4f1f1;color:#1a2940}
:root[data-theme=light] .foot-base,:root:not([data-theme=dark]) .foot-base{border-top-color:rgba(26,41,64,.18)}
:root[data-theme=light] .site-header,:root:not([data-theme=dark]) .site-header{background:#e4f1f1}
/* light theme: product-card tags in the footer/header pale blue-green */
:root[data-theme=light] .prodcard-tag,:root:not([data-theme=dark]) .prodcard-tag{background:#e4f1f1;color:#1a2940;box-shadow:0 0 0 1px rgba(26,41,64,.18)}
/* light theme: team cards in the two-tone gray scheme like the other cards */
:root[data-theme=light] .person,:root:not([data-theme=dark]) .person{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink)}
:root[data-theme=light] .person:hover,:root:not([data-theme=dark]) .person:hover{background:linear-gradient(135deg,var(--lt-a2) 0%,var(--lt-b2) 100%)}
:root[data-theme=light] .person::after,:root:not([data-theme=dark]) .person::after{content:"";position:absolute;right:-34px;top:-30px;bottom:-30px;width:120px;background:rgba(255,255,255,.6);transform:skewX(-14deg);pointer-events:none;z-index:0}
:root[data-theme=light] .person>*,:root:not([data-theme=dark]) .person>*{position:relative;z-index:1}
:root[data-theme=light] .person h3,:root:not([data-theme=dark]) .person h3{color:var(--lt-ink)}
:root[data-theme=light] .person .role,:root:not([data-theme=dark]) .person .role{color:var(--lt-sub)}
/* light theme: rental strip in the footer colour, separated from the footer by a thin line */
:root[data-theme=light] .cta-band,:root:not([data-theme=dark]) .cta-band{background:#e4f1f1;border-bottom:1px solid rgba(26,41,64,.15)}
/* light theme: contact team cards in the two-tone gray scheme (dark theme keeps the blue) */
:root[data-theme=light] .bcard,:root:not([data-theme=dark]) .bcard{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink);border-color:#cfd6de}
:root[data-theme=light] .bcard::after,:root:not([data-theme=dark]) .bcard::after{background:rgba(255,255,255,.6)}
:root[data-theme=light] .bcard h3,:root:not([data-theme=dark]) .bcard h3{color:var(--lt-ink)}
:root[data-theme=light] .bcard .role,:root:not([data-theme=dark]) .bcard .role{color:var(--lt-sub)}
:root[data-theme=light] .bc-lines svg,:root:not([data-theme=dark]) .bc-lines svg{color:var(--lt-ink)}
:root[data-theme=light] .bc-lines a,:root:not([data-theme=dark]) .bc-lines a{color:var(--lt-ink)}
:root[data-theme=light] .bc-lines a:hover,:root:not([data-theme=dark]) .bc-lines a:hover{text-decoration:underline}
/* light theme: page background strips use only white and the footer colour */
:root[data-theme=light] .section.alt,:root[data-theme=light] .page-head,:root[data-theme=light] .product-head,:root[data-theme=light] .facts,:root[data-theme=light] .rental,
:root:not([data-theme=dark]) .section.alt,:root:not([data-theme=dark]) .page-head,:root:not([data-theme=dark]) .product-head,:root:not([data-theme=dark]) .facts,:root:not([data-theme=dark]) .rental{background:#e4f1f1}
/* product cards: photo sits a little lower so it does not collide with the tag banner */
.prodcard:not(.feat) .prodcard-img img{height:calc(100% - 30px);margin-top:30px;object-fit:contain;object-position:50% 100%}
/* yellow line above the footer on all pages (light theme, like under the header) */
:root[data-theme=light] .site-footer,:root:not([data-theme=dark]) .site-footer{border-top:3px solid var(--signal)}
/* product cards, better fit: photo fills the whole frame, shifted down and faded in from white at the top (no visible photo edge) */
.prodcard:not(.feat) .prodcard-img img{height:100%;margin-top:0;object-fit:cover;object-position:50% 0;transform:translateY(26px);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 40px);mask-image:linear-gradient(to bottom,transparent 0,#000 40px)}
.prodcard:not(.feat):hover .prodcard-img img{transform:translateY(26px) scale(1.04)}
/* rental strip: white */
:root[data-theme=light] .cta-band,:root:not([data-theme=dark]) .cta-band{background:#fff;border-bottom:0}
/* news cover without video: headline only, one continuous card (slanted band runs through top and bottom), thin yellow split line */
.ncard-art{background:none!important;color:var(--lt-ink);justify-content:flex-start;padding:0 9%;container-type:inline-size}
.ncard-art::before,.ncard-art::after{display:none!important}
.ncard-art h4{position:relative;margin:0;padding-left:5cqw;font:italic 800 clamp(24px,10.6cqw,54px)/1 var(--font);letter-spacing:-.01em;text-transform:uppercase;color:inherit;max-width:100%}
.ncard-art h4::before{content:"";position:absolute;left:0;top:.08em;bottom:.08em;width:1.6cqw;background:var(--signal);transform:skewX(-14deg)}
:root[data-theme=dark] .ncard-art{color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .ncard-art{color:#fff}}
article.ncard:has(.ncard-art)::after{right:-120px;width:300px}
article.ncard:has(.ncard-art) .ncard-img{background:none!important}
/* Josh: the source photo is cropped flat at the top of the head – instead of fading it out, a soft hair-coloured cap rounds the top */
.bcard[data-pid="2091"] .bc-photo img{-webkit-mask-image:none!important;mask-image:none!important}
:root[data-theme=light] .cta-band,:root:not([data-theme=dark]) .cta-band{background:#e4f1f1}

/* footer: centred Back to top button */
.foot-top{display:flex;justify-content:center;margin-top:28px}
.to-top{display:inline-flex;align-items:center;gap:8px;font:600 .9rem/1 var(--font);padding:11px 22px;border-radius:999px;border:1.5px solid currentColor;background:none;color:inherit;cursor:pointer;transition:background .2s,color .2s}
.to-top:hover,.to-top:focus-visible{background:var(--signal);border-color:var(--signal);color:#141618}
/* product cards, final fit: the whole photo is shown (nothing cropped), a little lower; its edges melt into the white so no photo frame is visible */
.prodcard:not(.feat) .prodcard-img img,.prodcard:not(.feat):hover .prodcard-img img{height:calc(100% - 28px);margin-top:28px;object-fit:contain;object-position:50% 100%;transform:none;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 14%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent 0,#000 9%,#000 91%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 14%);mask-composite:intersect}
.prodcard:not(.feat):hover .prodcard-img img{transform:scale(1.04)}
.to-top::before{content:"↑";font-size:1.1em;line-height:1}
/* yellow lines under the header and above the footer: 30% thinner */
:root[data-theme=light] .site-header,:root:not([data-theme=dark]) .site-header{border-bottom-width:2px}
:root[data-theme=light] .site-footer,:root:not([data-theme=dark]) .site-footer{border-top-width:2px}
/* footer socials: same circled icons as on the contact page (light + dark) */
.foot-social{padding:0;border:0;gap:6px}
.foot-social a{display:flex;gap:11px;align-items:center;padding:3px 0;font-weight:400}
.foot-social svg{padding:6px;width:20px;height:20px;border:1.5px solid currentColor;opacity:.85}
.foot-grid .foot-social a:hover svg{background:var(--signal);color:#141618;border-color:var(--signal);opacity:1}
/* social icons in brand colours (footer + contact page, light and dark) */
.social-list svg{color:#fff!important;border-color:transparent!important;stroke:#fff}
.s-youtube svg{background:#FF0000}
.s-instagram svg{background:linear-gradient(45deg,#f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%)}
.s-facebook svg{background:#1877F2}.s-linkedin svg{background:#0A66C2}
.s-facebook svg path,.s-linkedin svg path{fill:#fff}
.s-youtube svg path{fill:#fff}
.social-list a:hover svg,.foot-grid .foot-social a:hover svg{background-clip:padding-box;filter:brightness(1.12);color:#fff!important;border-color:transparent!important}
.s-youtube:hover svg{background:#FF0000!important}.s-facebook:hover svg{background:#1877F2!important}.s-linkedin:hover svg{background:#0A66C2!important}
.s-instagram:hover svg{background:linear-gradient(45deg,#f09433,#bc1888)!important}
/* info boxes: same rounded corners as the cards and the map preview (12px) */
.cm-card,.card,.steps li,.academy,.screen-list li,.lang-list,.modal,.media,.ac-media,.prose img,.rmap,#map,.rcard,.excard,.person,.ph-img,.ph-vid,.video,.gallery a,.cat-tile,.pcard,.ncard-img,.pc-foot,.facts,.sent,.form-msg .sent,#formMsg .sent,.ac-notice,.pc-page .ptcard{border-radius:12px}
.inq input:not([type=checkbox]),.inq textarea,.inq select{border-radius:8px}
/* form fields: a single yellow frame when selected (no dark ring) */
input:focus,input:focus-visible,textarea:focus,textarea:focus-visible,select:focus,select:focus-visible{outline:0!important;border-color:var(--signal)!important;box-shadow:0 0 0 2px var(--signal)!important}
input[type=checkbox]:focus-visible{outline:2px solid var(--signal)!important;outline-offset:2px;box-shadow:none!important}
/* rental search, filters and form fields: rounded like the cards */
.search input,.rental-bar select,.rental-bar input,.rental-side select,.rental-side input,.inq input:not([type=checkbox]),.inq textarea,.inq select{border-radius:12px}
/* rental page: lighter colouring – selected filters in steel gray (no dark navy, no yellow detail) */
.cf-chip[aria-pressed=true]{background:#93A7B0;border-color:#93A7B0;color:#141f2d;box-shadow:none}
.rental .chip.on,.rental-side .chip.on{background:#93A7B0;border-color:#93A7B0;color:#141f2d}
.rental .chip.on em,.rental-side .chip.on em{color:#141f2d;opacity:.7}
/* rental company card (pop-up and page): two-tone gray header in the light theme, navy stays in dark */
:root[data-theme=light] .pc-head,:root:not([data-theme=dark]) .pc-head{background:linear-gradient(135deg,var(--lt-a) 0%,var(--lt-b) 100%);color:var(--lt-ink);border-bottom:1px solid #cfd6de}
:root[data-theme=light] .pc-head::after,:root:not([data-theme=dark]) .pc-head::after{background:rgba(255,255,255,.6)}
:root[data-theme=light] .pc-head h2,:root:not([data-theme=dark]) .pc-head h2{color:var(--lt-ink)}
:root[data-theme=light] .pc-eyebrow,:root:not([data-theme=dark]) .pc-eyebrow{color:var(--lt-sub)}
:root[data-theme=light] .pc-city,:root:not([data-theme=dark]) .pc-city{color:var(--lt-sub)}
:root[data-theme=dark] .pc-head{background:linear-gradient(135deg,#1a2940 0%,#27406a 100%)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .pc-head{background:linear-gradient(135deg,#1a2940 0%,#27406a 100%)}}
/* discontinued cranes: rounded like the other crane chips */
.chip.static,.ptcard .chip,.pc-row .chip{border-radius:99px}
/* download cards of the 2026 drawings: the first page of the PDF is the preview in the top section */
.dprev{position:absolute;inset:0;background:#fff;overflow:hidden}
.dprev img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:transform .45s var(--ease)}
.doc:hover .dprev img{transform:scale(1.04)}
.dprev::after{content:"";position:absolute;inset:0;box-shadow:inset 0 -1px 0 rgba(26,41,64,.12);pointer-events:none}
/* product page buttons: grey theme on the light site, navy stays on the dark site */
:root[data-theme=light] .tabbar a[role=tab],:root:not([data-theme=dark]) .tabbar a[role=tab]{color:#1a2940;box-shadow:inset 0 0 0 2px #b9c6cc;background:linear-gradient(105deg,#dfe4ea 0 50%,transparent 50%) 100% 0/260% 100% no-repeat}
:root[data-theme=light] .tabbar a[role=tab]:hover,:root:not([data-theme=dark]) .tabbar a[role=tab]:hover{background-position:0 0;color:#1a2940}
:root[data-theme=light] .tabbar a[role=tab][aria-selected=true],:root:not([data-theme=dark]) .tabbar a[role=tab][aria-selected=true]{background:#93A7B0;color:#141f2d;box-shadow:inset 0 0 0 2px #93A7B0}
:root[data-theme=light] .tabbar a[role=tab][aria-selected=true]::before,:root:not([data-theme=dark]) .tabbar a[role=tab][aria-selected=true]::before{background:#141f2d}
:root[data-theme=light] .tabbar a[role=tab][aria-selected=true]::after,:root:not([data-theme=dark]) .tabbar a[role=tab][aria-selected=true]::after{background:#fff;color:#141f2d}
:root[data-theme=light] .cta-row .btn-ghost[data-i],:root:not([data-theme=dark]) .cta-row .btn-ghost[data-i]{color:#1a2940;box-shadow:inset 0 0 0 2px #b9c6cc;background:linear-gradient(105deg,#dfe4ea 0 50%,transparent 50%) 100% 0/260% 100% no-repeat}
:root[data-theme=light] .cta-row .btn-ghost[data-i]:hover,:root:not([data-theme=dark]) .cta-row .btn-ghost[data-i]:hover{color:#1a2940}
:root[data-theme=light] .cta-row .btn-signal[data-i],:root:not([data-theme=dark]) .cta-row .btn-signal[data-i]{background:linear-gradient(105deg,#93A7B0 0 50%,transparent 50%) 100% 0/260% 100% no-repeat,var(--signal)}
:root[data-theme=light] .cta-row .btn-signal[data-i]:hover,:root:not([data-theme=dark]) .cta-row .btn-signal[data-i]:hover{color:#141f2d}
:root[data-theme=light] .cta-row .btn[data-i]:active,:root[data-theme=light] .cta-row .btn[data-i]:focus-visible,:root:not([data-theme=dark]) .cta-row .btn[data-i]:active,:root:not([data-theme=dark]) .cta-row .btn[data-i]:focus-visible{background:#93A7B0;color:#141f2d;box-shadow:inset 0 0 0 2px #93A7B0}
:root[data-theme=light] .cta-row .btn[data-i]:active::before,:root[data-theme=light] .cta-row .btn[data-i]:focus-visible::before,:root:not([data-theme=dark]) .cta-row .btn[data-i]:active::before,:root:not([data-theme=dark]) .cta-row .btn[data-i]:focus-visible::before{background:#141f2d}
/* unified buttons (same look as the crane filter chips): 6px corners, 2px steel outline; steel gray when selected; navy stays on the dark site */
.btn,.btn-ghost,.btn-mini,.chip,.nav-cta,.cta-row .btn[data-i],.tabbar a[role=tab]{border-radius:6px!important}
:root[data-theme=light] .btn-signal,:root[data-theme=light] .btn-mini.primary,:root[data-theme=light] .nav-cta,:root[data-theme=light] .cta-row .btn-signal[data-i],:root:not([data-theme=dark]) .btn-signal,:root:not([data-theme=dark]) .btn-mini.primary,:root:not([data-theme=dark]) .nav-cta,:root:not([data-theme=dark]) .cta-row .btn-signal[data-i]{box-shadow:inset 0 0 0 2px #33465A}
:root[data-theme=light] .btn-ghost,:root[data-theme=light] .cta-row .btn-ghost[data-i],:root[data-theme=light] .btn-mini,:root[data-theme=light] .tabbar a[role=tab],:root:not([data-theme=dark]) .btn-ghost,:root:not([data-theme=dark]) .cta-row .btn-ghost[data-i],:root:not([data-theme=dark]) .btn-mini,:root:not([data-theme=dark]) .tabbar a[role=tab]{box-shadow:inset 0 0 0 2px #33465A;background-color:#fff}
:root[data-theme=light] .tabbar a[role=tab][aria-selected=true],:root:not([data-theme=dark]) .tabbar a[role=tab][aria-selected=true]{box-shadow:inset 0 0 0 2px #33465A;background:#93A7B0}
:root[data-theme=light] .cta-row .btn[data-i]:active,:root[data-theme=light] .cta-row .btn[data-i]:focus-visible,:root:not([data-theme=dark]) .cta-row .btn[data-i]:active,:root:not([data-theme=dark]) .cta-row .btn[data-i]:focus-visible{box-shadow:inset 0 0 0 2px #33465A;background:#93A7B0}
:root[data-theme=light] .btn-signal:hover,:root[data-theme=light] .btn-mini.primary:hover,:root:not([data-theme=dark]) .btn-signal:hover,:root:not([data-theme=dark]) .btn-mini.primary:hover{background:#fff;color:#141618}
/* rental cards (light theme): company name in a strong blue, city in deep steel – they stand out from the gray card (dark theme keeps white / yellow) */
:root[data-theme=light] .rc-name,:root[data-theme=light] .rc-name a,:root:not([data-theme=dark]) .rc-name,:root:not([data-theme=dark]) .rc-name a{color:#33465A;font-weight:700}
:root[data-theme=light] .rc-city,:root[data-theme=light] .rc-city span,:root:not([data-theme=dark]) .rc-city,:root:not([data-theme=dark]) .rc-city span{color:#33465A;font-weight:600}
:root[data-theme=light] .rc-city svg,:root:not([data-theme=dark]) .rc-city svg{color:#33465A}
/* light theme: important names (product lines, crane names, documents, news headlines, card titles) in the strong blue */
:root[data-theme=light] a.prodcard .prodcard-body h3,:root[data-theme=light] a.routecard .prodcard-body h3,:root[data-theme=light] article.ncard h3,:root[data-theme=light] article.ncard h3 a,:root[data-theme=light] .ncard-body h3 a,:root[data-theme=light] .doc:not(.doc-video) .dart-txt b,:root[data-theme=light] .doc-video .doc-body strong,:root[data-theme=light] .doc-video .doc-body h3,:root[data-theme=light] .excard h3,:root[data-theme=light] .excard .ex-body h3,:root[data-theme=light] .excard .ex-body strong,:root[data-theme=light] .bcard h3,:root[data-theme=light] .person h3,:root[data-theme=light] .art-card h2,:root[data-theme=light] .cat-tile h3,:root[data-theme=light] .pcard-body h3,:root[data-theme=light] .home-news h3,:root[data-theme=light] .tile h3,:root[data-theme=light] .tile-body h3,:root[data-theme=light] .pc-head h2,:root:not([data-theme=dark]) a.prodcard .prodcard-body h3,:root:not([data-theme=dark]) a.routecard .prodcard-body h3,:root:not([data-theme=dark]) article.ncard h3,:root:not([data-theme=dark]) article.ncard h3 a,:root:not([data-theme=dark]) .ncard-body h3 a,:root:not([data-theme=dark]) .doc:not(.doc-video) .dart-txt b,:root:not([data-theme=dark]) .doc-video .doc-body strong,:root:not([data-theme=dark]) .doc-video .doc-body h3,:root:not([data-theme=dark]) .excard h3,:root:not([data-theme=dark]) .excard .ex-body h3,:root:not([data-theme=dark]) .excard .ex-body strong,:root:not([data-theme=dark]) .bcard h3,:root:not([data-theme=dark]) .person h3,:root:not([data-theme=dark]) .art-card h2,:root:not([data-theme=dark]) .cat-tile h3,:root:not([data-theme=dark]) .pcard-body h3,:root:not([data-theme=dark]) .home-news h3,:root:not([data-theme=dark]) .tile h3,:root:not([data-theme=dark]) .tile-body h3,:root:not([data-theme=dark]) .pc-head h2{color:#33465A}
:root[data-theme=light] .numstrip strong,:root[data-theme=light] .numstrip li strong,:root[data-theme=light] .person-row h4,:root[data-theme=light] .person-row h3,:root[data-theme=light] .about .person h3,:root[data-theme=light] .team h3,:root[data-theme=light] .team-card h3,:root[data-theme=light] .bc-body h3,:root[data-theme=light] .person .role-name,:root:not([data-theme=dark]) .numstrip strong,:root:not([data-theme=dark]) .numstrip li strong,:root:not([data-theme=dark]) .person-row h4,:root:not([data-theme=dark]) .person-row h3,:root:not([data-theme=dark]) .about .person h3,:root:not([data-theme=dark]) .team h3,:root:not([data-theme=dark]) .team-card h3,:root:not([data-theme=dark]) .bc-body h3,:root:not([data-theme=dark]) .person .role-name{color:#33465A}
/* buttons on photos / dark bands keep light text on a transparent fill (the unified white fill is for light surfaces only) */
:root[data-theme=light] .ac-hero .btn-ghost,:root:not([data-theme=dark]) .ac-hero .btn-ghost,:root[data-theme=light] .vslider .btn-ghost,:root:not([data-theme=dark]) .vslider .btn-ghost{background:rgba(20,22,24,.25);color:#fff;box-shadow:inset 0 0 0 2px #fff}
:root[data-theme=light] .ac-hero .btn-ghost:hover,:root:not([data-theme=dark]) .ac-hero .btn-ghost:hover{background:#fff;color:#141618}
/* Academy notice bar: straight edges */
.ac-notice,:root[data-theme=light] .ac-notice,:root:not([data-theme=dark]) .ac-notice{border-radius:0!important}
/* PDF preview cards: the document name on a dark fade at the bottom of the preview (as on the icon cards) */
.dprev .dart-txt{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:46px 16px 12px;background:linear-gradient(0deg,rgba(20,32,48,.94) 0,rgba(20,32,48,.86) 55%,rgba(20,32,48,0) 100%);display:flex;flex-direction:column;gap:1px}
.dprev .dart-txt small{font:600 .66rem/1 var(--font);letter-spacing:.16em;text-transform:uppercase;color:#b9c8d0}
.dprev .dart-txt b{font:700 1.2rem/1.15 var(--font);color:#fff!important}
.dprev .dart-txt span{font:500 .88rem/1.2 var(--font);color:#dfe6ec}
.dprev .dart-fmt{z-index:3}
.doc .dprev .dart-txt{background:linear-gradient(0deg,rgba(20,32,48,.95) 0,rgba(20,32,48,.9) 60%,rgba(20,32,48,0) 100%)!important}
.doc .dprev .dart-txt small{color:#b9c8d0!important}.doc .dprev .dart-txt b{color:#fff!important}.doc .dprev .dart-txt span{color:#e6edf2!important}
/* light theme: page titles and product-line headings in the strong blue */
:root[data-theme=light] .page-head h1,:root[data-theme=light] .sec-head h2,:root[data-theme=light] .cat-sec .sec-head h2,:root[data-theme=light] .section-title,:root[data-theme=light] .product-head h1,:root:not([data-theme=dark]) .page-head h1,:root:not([data-theme=dark]) .sec-head h2,:root:not([data-theme=dark]) .cat-sec .sec-head h2,:root:not([data-theme=dark]) .section-title,:root:not([data-theme=dark]) .product-head h1{color:#33465A}
/* DOWNLOAD CARD RULE: the top part holds only a preview (or, without a preview, a big icon) – the name of the document is always in the bottom part */
.doc-body .doc-name{font-size:1.08rem;font-weight:700;line-height:1.25;color:var(--heading)}
:root[data-theme=light] .doc:not(.doc-video) .doc-body .doc-name,:root:not([data-theme=dark]) .doc:not(.doc-video) .doc-body .doc-name{color:#33465A}
:root[data-theme=dark] .doc:not(.doc-video) .doc-body .doc-name{color:#fff}
.dart-ico{top:50%!important;width:66%!important}
/* download card name: crane on the first row, document on the second */
.doc-name{display:flex;flex-direction:column;gap:2px}
.doc-name .dn-prod{font-size:1.15rem;font-weight:700;line-height:1.2}
.doc-name .dn-file{font-size:1rem;font-weight:500;line-height:1.25;color:var(--text)}
.doc-name .dn-prod+.dn-file{color:var(--muted)}
/* one name style for every download card (documents and videos): row 1 bold, row 2 lighter */
.doc .doc-name,.doc-video .doc-body .doc-name{font-family:var(--font);letter-spacing:0;display:flex;flex-direction:column;gap:2px}
.doc .doc-name .dn-prod{font:700 1.15rem/1.2 var(--font);letter-spacing:0;color:var(--heading)}
.doc .doc-name .dn-file{font:500 1rem/1.25 var(--font);letter-spacing:0;color:var(--muted)}
:root[data-theme=light] .doc .doc-name .dn-prod,:root:not([data-theme=dark]) .doc .doc-name .dn-prod{color:#33465A}
:root[data-theme=light] .doc .doc-name .dn-file,:root:not([data-theme=dark]) .doc .doc-name .dn-file{color:var(--lt-sub)}
:root[data-theme=dark] .doc .doc-name .dn-prod{color:#fff}
:root[data-theme=dark] .doc .doc-name .dn-file{color:#cfd8de}
/* dark theme: documents and videos share one card design (navy body, slanted band, yellow action line) */
:root[data-theme=dark] .doc:not(.doc-video) .doc-body{position:relative;overflow:hidden;background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);color:#fff}
:root[data-theme=dark] .doc:not(.doc-video):hover .doc-body{background:linear-gradient(135deg,#1f3151 0%,#2e4a77 100%)}
:root[data-theme=dark] .doc:not(.doc-video) .doc-body::after{content:"";position:absolute;right:-34px;top:-30px;bottom:-30px;width:140px;background:rgba(255,255,255,.07);transform:skewX(-14deg);pointer-events:none;display:block}
:root[data-theme=dark] .doc:not(.doc-video) .doc-body>*{position:relative;z-index:1}
:root[data-theme=dark] .doc .dl{color:var(--signal)}
@media (prefers-color-scheme:dark){
:root:not([data-theme=light]) .doc:not(.doc-video) .doc-body{position:relative;overflow:hidden;background:linear-gradient(135deg,#1a2940 0%,#27406a 100%);color:#fff}
:root:not([data-theme=light]) .doc:not(.doc-video):hover .doc-body{background:linear-gradient(135deg,#1f3151 0%,#2e4a77 100%)}
:root:not([data-theme=light]) .doc:not(.doc-video) .doc-body::after{content:"";position:absolute;right:-34px;top:-30px;bottom:-30px;width:140px;background:rgba(255,255,255,.07);transform:skewX(-14deg);pointer-events:none;display:block}
:root:not([data-theme=light]) .doc:not(.doc-video) .doc-body>*{position:relative;z-index:1}
:root:not([data-theme=light]) .doc .dl{color:var(--signal)}}
/* dark theme consistency: rental filters keep the navy / yellow look, rental cards get the same yellow edge as all other cards */
:root[data-theme=dark] .cf-chip[aria-pressed=true]{background:var(--deep-steel);border-color:var(--deep-steel);color:#fff;box-shadow:inset 0 -3px 0 var(--signal)}
:root[data-theme=dark] .rental .chip.on,:root[data-theme=dark] .rental-side .chip.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
:root[data-theme=dark] .rental .chip.on em,:root[data-theme=dark] .rental-side .chip.on em{color:var(--on-accent);opacity:.7}
:root[data-theme=dark] article.rcard{border-color:var(--signal)}
@media (prefers-color-scheme:dark){
:root:not([data-theme=light]) .cf-chip[aria-pressed=true]{background:var(--deep-steel);border-color:var(--deep-steel);color:#fff;box-shadow:inset 0 -3px 0 var(--signal)}
:root:not([data-theme=light]) .rental .chip.on,:root:not([data-theme=light]) .rental-side .chip.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
:root:not([data-theme=light]) article.rcard{border-color:var(--signal)}}
/* home: four news cards in the same grid as the four product lines */
.home-news{grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:1100px){.home-news{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.home-news{grid-template-columns:1fr}}
/* home news cards: same overall size as the product-line cards – the picture keeps its 16:9 shape (nothing cropped, no black bars), the text part takes the rest */

/* news cards: the picture area has straight edges inside the card (only the card itself is rounded) */
.ncard-img,.ncard-img .video,.ncard-img img,.ncard-img a,.ncard-img .vbar,article.ncard .ncard-img{border-radius:0!important}
/* gallery pictures that are drawings: shown whole on white */
.gallery img[src*="/gallery/st64-"]{object-fit:contain;background:#fff}
/* home news cards: exactly as tall as the product-line cards at every width (product card = 4:3 picture + 230px text part; news picture is 16:9, so its text part is 230px + the 4:3 / 16:9 difference) */
.home-news article.ncard .ncard-body{height:auto;flex:1 1 auto;min-height:0;overflow:hidden}
@media (min-width:1101px){.home-news article.ncard .ncard-body{padding-top:12px;padding-bottom:12px}.home-news article.ncard h3{font-size:1.02rem;margin:2px 0 4px}.home-news article.ncard .ncard-body p.ex{-webkit-line-clamp:1;line-clamp:1;margin:0}}
/* product photos with the background removed (TC10, TD10): no edge fade, crane fills the card */
.prodcard:not(.feat) .prodcard-img img[src*="cut-prod"],.prodcard:not(.feat):hover .prodcard-img img[src*="cut-prod"]{-webkit-mask-image:none;mask-image:none;padding:4px 10px!important;background:none!important}
/* TC10 card: the crane a bit bigger (less top offset, no padding, slight zoom from the base) */
.prodcard:not(.feat) .prodcard-img img[src*="cut-prod/tc10"]{margin-top:12px;height:calc(100% - 12px);padding:0!important;transform:scale(1.1);transform-origin:50% 100%}
.prodcard:not(.feat):hover .prodcard-img img[src*="cut-prod/tc10"]{transform:scale(1.14);transform-origin:50% 100%}
.prodcard:not(.feat) .prodcard-img img[src*="cut-prod/tc10"]{margin-top:14px;height:calc(100% - 14px);transform:none}
.prodcard:not(.feat):hover .prodcard-img img[src*="cut-prod/tc10"]{transform:scale(1.03)}
/* rental company pop-up, light theme: close button in black on the light header (white stays in the dark theme) */
:root[data-theme=light] .modal-partner .x,:root:not([data-theme=dark]) .modal-partner .x{color:#141618;background:rgba(20,22,24,.08)}
:root[data-theme=light] .modal-partner .x:hover,:root:not([data-theme=dark]) .modal-partner .x:hover{background:rgba(20,22,24,.16)}
/* light theme: product and product-line cards use the same light frame as the team cards (no dark edge) */
:root[data-theme=light] a.prodcard,:root[data-theme=light] a.prodcard:hover,:root[data-theme=light] a.prodcard:focus-visible,
:root:not([data-theme=dark]) a.prodcard,:root:not([data-theme=dark]) a.prodcard:hover,:root:not([data-theme=dark]) a.prodcard:focus-visible{border-color:#cfd6de}
/* main product video: same 12px rounded corners as the cards (also while playing) */
.ph-vid{border-radius:12px;overflow:hidden}
.ph-vid .video,.ph-vid .video.playing,.ph-vid iframe{border-radius:12px!important;overflow:hidden}
/* light theme: every card uses the team-card frame – thin light edge, 14px corners, soft shadow (no dark edge, also on hover) */
:root[data-theme=light] a.prodcard,:root[data-theme=light] a.prodcard:hover,:root[data-theme=light] a.prodcard:focus-visible,:root[data-theme=light] a.prodcard:focus-within,:root[data-theme=light] article.ncard,:root[data-theme=light] article.ncard:hover,:root[data-theme=light] article.ncard:focus-visible,:root[data-theme=light] article.ncard:focus-within,:root[data-theme=light] .ncard,:root[data-theme=light] .ncard:hover,:root[data-theme=light] .ncard:focus-visible,:root[data-theme=light] .ncard:focus-within,:root[data-theme=light] article.rcard,:root[data-theme=light] article.rcard:hover,:root[data-theme=light] article.rcard:focus-visible,:root[data-theme=light] article.rcard:focus-within,:root[data-theme=light] .rcard,:root[data-theme=light] .rcard:hover,:root[data-theme=light] .rcard:focus-visible,:root[data-theme=light] .rcard:focus-within,:root[data-theme=light] .excard,:root[data-theme=light] .excard:hover,:root[data-theme=light] .excard:focus-visible,:root[data-theme=light] .excard:focus-within,:root[data-theme=light] .doc,:root[data-theme=light] .doc:hover,:root[data-theme=light] .doc:focus-visible,:root[data-theme=light] .doc:focus-within,:root[data-theme=light] .gallery a,:root[data-theme=light] .gallery a:hover,:root[data-theme=light] .gallery a:focus-visible,:root[data-theme=light] .gallery a:focus-within,:root[data-theme=light] .art-card,:root[data-theme=light] .art-card:hover,:root[data-theme=light] .art-card:focus-visible,:root[data-theme=light] .art-card:focus-within,:root[data-theme=light] a.routecard,:root[data-theme=light] a.routecard:hover,:root[data-theme=light] a.routecard:focus-visible,:root[data-theme=light] a.routecard:focus-within,:root[data-theme=light] .pcard,:root[data-theme=light] .pcard:hover,:root[data-theme=light] .pcard:focus-visible,:root[data-theme=light] .pcard:focus-within,:root[data-theme=light] .person,:root[data-theme=light] .person:hover,:root[data-theme=light] .person:focus-visible,:root[data-theme=light] .person:focus-within,:root[data-theme=light] .cm-card,:root[data-theme=light] .cm-card:hover,:root[data-theme=light] .cm-card:focus-visible,:root[data-theme=light] .cm-card:focus-within,:root[data-theme=light] .bcard,:root[data-theme=light] .bcard:hover,:root[data-theme=light] .bcard:focus-visible,:root[data-theme=light] .bcard:focus-within,:root:not([data-theme=dark]) a.prodcard,:root:not([data-theme=dark]) a.prodcard:hover,:root:not([data-theme=dark]) a.prodcard:focus-visible,:root:not([data-theme=dark]) a.prodcard:focus-within,:root:not([data-theme=dark]) article.ncard,:root:not([data-theme=dark]) article.ncard:hover,:root:not([data-theme=dark]) article.ncard:focus-visible,:root:not([data-theme=dark]) article.ncard:focus-within,:root:not([data-theme=dark]) .ncard,:root:not([data-theme=dark]) .ncard:hover,:root:not([data-theme=dark]) .ncard:focus-visible,:root:not([data-theme=dark]) .ncard:focus-within,:root:not([data-theme=dark]) article.rcard,:root:not([data-theme=dark]) article.rcard:hover,:root:not([data-theme=dark]) article.rcard:focus-visible,:root:not([data-theme=dark]) article.rcard:focus-within,:root:not([data-theme=dark]) .rcard,:root:not([data-theme=dark]) .rcard:hover,:root:not([data-theme=dark]) .rcard:focus-visible,:root:not([data-theme=dark]) .rcard:focus-within,:root:not([data-theme=dark]) .excard,:root:not([data-theme=dark]) .excard:hover,:root:not([data-theme=dark]) .excard:focus-visible,:root:not([data-theme=dark]) .excard:focus-within,:root:not([data-theme=dark]) .doc,:root:not([data-theme=dark]) .doc:hover,:root:not([data-theme=dark]) .doc:focus-visible,:root:not([data-theme=dark]) .doc:focus-within,:root:not([data-theme=dark]) .gallery a,:root:not([data-theme=dark]) .gallery a:hover,:root:not([data-theme=dark]) .gallery a:focus-visible,:root:not([data-theme=dark]) .gallery a:focus-within,:root:not([data-theme=dark]) .art-card,:root:not([data-theme=dark]) .art-card:hover,:root:not([data-theme=dark]) .art-card:focus-visible,:root:not([data-theme=dark]) .art-card:focus-within,:root:not([data-theme=dark]) a.routecard,:root:not([data-theme=dark]) a.routecard:hover,:root:not([data-theme=dark]) a.routecard:focus-visible,:root:not([data-theme=dark]) a.routecard:focus-within,:root:not([data-theme=dark]) .pcard,:root:not([data-theme=dark]) .pcard:hover,:root:not([data-theme=dark]) .pcard:focus-visible,:root:not([data-theme=dark]) .pcard:focus-within,:root:not([data-theme=dark]) .person,:root:not([data-theme=dark]) .person:hover,:root:not([data-theme=dark]) .person:focus-visible,:root:not([data-theme=dark]) .person:focus-within,:root:not([data-theme=dark]) .cm-card,:root:not([data-theme=dark]) .cm-card:hover,:root:not([data-theme=dark]) .cm-card:focus-visible,:root:not([data-theme=dark]) .cm-card:focus-within,:root:not([data-theme=dark]) .bcard,:root:not([data-theme=dark]) .bcard:hover,:root:not([data-theme=dark]) .bcard:focus-visible,:root:not([data-theme=dark]) .bcard:focus-within{border:2px solid #cfd6de!important;border-radius:14px}
:root[data-theme=light] a.prodcard,:root[data-theme=light] article.ncard,:root[data-theme=light] .ncard,:root[data-theme=light] article.rcard,:root[data-theme=light] .rcard,:root[data-theme=light] .excard,:root[data-theme=light] .doc,:root[data-theme=light] .gallery a,:root[data-theme=light] .art-card,:root[data-theme=light] a.routecard,:root[data-theme=light] .pcard,:root[data-theme=light] .person,:root[data-theme=light] .cm-card,:root[data-theme=light] .bcard,:root:not([data-theme=dark]) a.prodcard,:root:not([data-theme=dark]) article.ncard,:root:not([data-theme=dark]) .ncard,:root:not([data-theme=dark]) article.rcard,:root:not([data-theme=dark]) .rcard,:root:not([data-theme=dark]) .excard,:root:not([data-theme=dark]) .doc,:root:not([data-theme=dark]) .gallery a,:root:not([data-theme=dark]) .art-card,:root:not([data-theme=dark]) a.routecard,:root:not([data-theme=dark]) .pcard,:root:not([data-theme=dark]) .person,:root:not([data-theme=dark]) .cm-card,:root:not([data-theme=dark]) .bcard{box-shadow:0 1px 2px rgba(20,22,24,.08),0 14px 30px -18px rgba(20,22,24,.55)}
/* light theme: softer accent – muted yellow instead of Signal Yellow (logos keep the brand yellow; dark theme unchanged) */
:root[data-theme=light]{--signal:#EADB72}
@media (prefers-color-scheme:light){:root:not([data-theme]){--signal:#EADB72}}
:root[data-theme=light] .gpin{background:var(--signal)}
/* header "Request a quote": same button as on the product pages – steel frame + envelope icon */
.bar .btn{display:inline-flex;align-items:center;gap:8px;--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%275%27%20width%3D%2718%27%20height%3D%2714%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27m3%207%209%206%209-6%27%2F%3E%3C%2Fsvg%3E")}
.bar .btn::before{content:"";flex:none;width:18px;height:18px;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
:root[data-theme=light] .bar .btn,:root:not([data-theme=dark]) .bar .btn{box-shadow:inset 0 0 0 2px #33465A}
/* unified yellow buttons (Request a quote, Send a message, Find a rental company, Back to top, form Send …): accent fill, 6px corners, steel frame, small icon before the text – light (soft yellow) and dark (Signal Yellow) */
.btn.btn-ico{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--signal)!important;color:#141618!important;border:0;border-radius:6px!important;box-shadow:inset 0 0 0 2px #33465A!important;font-weight:700;text-decoration:none;transform:none}
.btn.btn-ico:hover,.btn.btn-ico:focus-visible{filter:brightness(1.06);transform:translateY(-1px)}
.btn.btn-ico::before{content:"";flex:none;width:18px;height:18px;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat;transform:none;animation:none}
.btn-ico[data-i=quote]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%275%27%20width%3D%2718%27%20height%3D%2714%27%20rx%3D%272%27%2F%3E%3Cpath%20d%3D%27m3%207%209%206%209-6%27%2F%3E%3C%2Fsvg%3E")}.btn-ico[data-i=rental]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2021s-7-6.2-7-11a7%207%200%200114%200c0%204.8-7%2011-7%2011z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2710%27%20r%3D%272.5%27%2F%3E%3C%2Fsvg%3E")}.btn-ico[data-i=up]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2019V5M5%2012l7-7%207%207%27%2F%3E%3C%2Fsvg%3E")}.btn-ico[data-i=send]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M22%202%2011%2013M22%202l-7%2020-4-9-9-4%2020-7z%27%2F%3E%3C%2Fsvg%3E")}
.to-top.btn-ico{padding:11px 22px;font-size:.92rem;line-height:1}.to-top.btn-ico::before{content:""}
.btn-ico[data-i=more]{--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%279%27%2F%3E%3Cpath%20d%3D%27M12%2011v6M12%207.5v.5%27%2F%3E%3C%2Fsvg%3E")}
/* light theme: every button uses the light card frame (2px #cfd6de) instead of the dark steel frame */
:root[data-theme=light] .btn.btn-ico,:root[data-theme=light] .btn.btn-ico:hover,:root[data-theme=light] .btn.btn-ico:focus-visible,:root[data-theme=light] .btn.btn-ico:active,:root[data-theme=light] .btn-signal,:root[data-theme=light] .btn-signal:hover,:root[data-theme=light] .btn-signal:focus-visible,:root[data-theme=light] .btn-signal:active,:root[data-theme=light] .btn-ghost,:root[data-theme=light] .btn-ghost:hover,:root[data-theme=light] .btn-ghost:focus-visible,:root[data-theme=light] .btn-ghost:active,:root[data-theme=light] .btn-mini,:root[data-theme=light] .btn-mini:hover,:root[data-theme=light] .btn-mini:focus-visible,:root[data-theme=light] .btn-mini:active,:root[data-theme=light] .nav-cta,:root[data-theme=light] .nav-cta:hover,:root[data-theme=light] .nav-cta:focus-visible,:root[data-theme=light] .nav-cta:active,:root[data-theme=light] .cta-row .btn[data-i],:root[data-theme=light] .cta-row .btn[data-i]:hover,:root[data-theme=light] .cta-row .btn[data-i]:focus-visible,:root[data-theme=light] .cta-row .btn[data-i]:active,:root[data-theme=light] .cta-row .btn-ghost[data-i],:root[data-theme=light] .cta-row .btn-ghost[data-i]:hover,:root[data-theme=light] .cta-row .btn-ghost[data-i]:focus-visible,:root[data-theme=light] .cta-row .btn-ghost[data-i]:active,:root[data-theme=light] .cta-row .btn-signal[data-i],:root[data-theme=light] .cta-row .btn-signal[data-i]:hover,:root[data-theme=light] .cta-row .btn-signal[data-i]:focus-visible,:root[data-theme=light] .cta-row .btn-signal[data-i]:active,:root[data-theme=light] .tabbar a[role=tab],:root[data-theme=light] .tabbar a[role=tab]:hover,:root[data-theme=light] .tabbar a[role=tab]:focus-visible,:root[data-theme=light] .tabbar a[role=tab]:active,:root[data-theme=light] .tabbar a[role=tab][aria-selected=true],:root[data-theme=light] .tabbar a[role=tab][aria-selected=true]:hover,:root[data-theme=light] .tabbar a[role=tab][aria-selected=true]:focus-visible,:root[data-theme=light] .tabbar a[role=tab][aria-selected=true]:active,:root[data-theme=light] .bar .btn,:root[data-theme=light] .bar .btn:hover,:root[data-theme=light] .bar .btn:focus-visible,:root[data-theme=light] .bar .btn:active,:root[data-theme=light] .to-top,:root[data-theme=light] .to-top:hover,:root[data-theme=light] .to-top:focus-visible,:root[data-theme=light] .to-top:active,:root:not([data-theme=dark]) .btn.btn-ico,:root:not([data-theme=dark]) .btn.btn-ico:hover,:root:not([data-theme=dark]) .btn.btn-ico:focus-visible,:root:not([data-theme=dark]) .btn.btn-ico:active,:root:not([data-theme=dark]) .btn-signal,:root:not([data-theme=dark]) .btn-signal:hover,:root:not([data-theme=dark]) .btn-signal:focus-visible,:root:not([data-theme=dark]) .btn-signal:active,:root:not([data-theme=dark]) .btn-ghost,:root:not([data-theme=dark]) .btn-ghost:hover,:root:not([data-theme=dark]) .btn-ghost:focus-visible,:root:not([data-theme=dark]) .btn-ghost:active,:root:not([data-theme=dark]) .btn-mini,:root:not([data-theme=dark]) .btn-mini:hover,:root:not([data-theme=dark]) .btn-mini:focus-visible,:root:not([data-theme=dark]) .btn-mini:active,:root:not([data-theme=dark]) .nav-cta,:root:not([data-theme=dark]) .nav-cta:hover,:root:not([data-theme=dark]) .nav-cta:focus-visible,:root:not([data-theme=dark]) .nav-cta:active,:root:not([data-theme=dark]) .cta-row .btn[data-i],:root:not([data-theme=dark]) .cta-row .btn[data-i]:hover,:root:not([data-theme=dark]) .cta-row .btn[data-i]:focus-visible,:root:not([data-theme=dark]) .cta-row .btn[data-i]:active,:root:not([data-theme=dark]) .cta-row .btn-ghost[data-i],:root:not([data-theme=dark]) .cta-row .btn-ghost[data-i]:hover,:root:not([data-theme=dark]) .cta-row .btn-ghost[data-i]:focus-visible,:root:not([data-theme=dark]) .cta-row .btn-ghost[data-i]:active,:root:not([data-theme=dark]) .cta-row .btn-signal[data-i],:root:not([data-theme=dark]) .cta-row .btn-signal[data-i]:hover,:root:not([data-theme=dark]) .cta-row .btn-signal[data-i]:focus-visible,:root:not([data-theme=dark]) .cta-row .btn-signal[data-i]:active,:root:not([data-theme=dark]) .tabbar a[role=tab],:root:not([data-theme=dark]) .tabbar a[role=tab]:hover,:root:not([data-theme=dark]) .tabbar a[role=tab]:focus-visible,:root:not([data-theme=dark]) .tabbar a[role=tab]:active,:root:not([data-theme=dark]) .tabbar a[role=tab][aria-selected=true],:root:not([data-theme=dark]) .tabbar a[role=tab][aria-selected=true]:hover,:root:not([data-theme=dark]) .tabbar a[role=tab][aria-selected=true]:focus-visible,:root:not([data-theme=dark]) .tabbar a[role=tab][aria-selected=true]:active,:root:not([data-theme=dark]) .bar .btn,:root:not([data-theme=dark]) .bar .btn:hover,:root:not([data-theme=dark]) .bar .btn:focus-visible,:root:not([data-theme=dark]) .bar .btn:active,:root:not([data-theme=dark]) .to-top,:root:not([data-theme=dark]) .to-top:hover,:root:not([data-theme=dark]) .to-top:focus-visible,:root:not([data-theme=dark]) .to-top:active{box-shadow:inset 0 0 0 2px #cfd6de!important}
:root[data-theme=light] .cf-chip,:root[data-theme=light] .cf-chip:hover,:root[data-theme=light] .cf-chip:focus-visible,:root[data-theme=light] .cf-chip:active,:root[data-theme=light] .cf-chip[aria-pressed=true],:root[data-theme=light] .cf-chip[aria-pressed=true]:hover,:root[data-theme=light] .cf-chip[aria-pressed=true]:focus-visible,:root[data-theme=light] .cf-chip[aria-pressed=true]:active,:root[data-theme=light] .chip,:root[data-theme=light] .chip:hover,:root[data-theme=light] .chip:focus-visible,:root[data-theme=light] .chip:active,:root[data-theme=light] .chip.on,:root[data-theme=light] .chip.on:hover,:root[data-theme=light] .chip.on:focus-visible,:root[data-theme=light] .chip.on:active,:root[data-theme=light] .icon-btn,:root[data-theme=light] .icon-btn:hover,:root[data-theme=light] .icon-btn:focus-visible,:root[data-theme=light] .icon-btn:active,:root[data-theme=light] .lang-btn,:root[data-theme=light] .lang-btn:hover,:root[data-theme=light] .lang-btn:focus-visible,:root[data-theme=light] .lang-btn:active,:root[data-theme=light] .rc-ico,:root[data-theme=light] .rc-ico:hover,:root[data-theme=light] .rc-ico:focus-visible,:root[data-theme=light] .rc-ico:active,:root[data-theme=light] .rc-actions a,:root[data-theme=light] .rc-actions a:hover,:root[data-theme=light] .rc-actions a:focus-visible,:root[data-theme=light] .rc-actions a:active,:root[data-theme=light] .linkbtn.btnish,:root[data-theme=light] .linkbtn.btnish:hover,:root[data-theme=light] .linkbtn.btnish:focus-visible,:root[data-theme=light] .linkbtn.btnish:active,:root:not([data-theme=dark]) .cf-chip,:root:not([data-theme=dark]) .cf-chip:hover,:root:not([data-theme=dark]) .cf-chip:focus-visible,:root:not([data-theme=dark]) .cf-chip:active,:root:not([data-theme=dark]) .cf-chip[aria-pressed=true],:root:not([data-theme=dark]) .cf-chip[aria-pressed=true]:hover,:root:not([data-theme=dark]) .cf-chip[aria-pressed=true]:focus-visible,:root:not([data-theme=dark]) .cf-chip[aria-pressed=true]:active,:root:not([data-theme=dark]) .chip,:root:not([data-theme=dark]) .chip:hover,:root:not([data-theme=dark]) .chip:focus-visible,:root:not([data-theme=dark]) .chip:active,:root:not([data-theme=dark]) .chip.on,:root:not([data-theme=dark]) .chip.on:hover,:root:not([data-theme=dark]) .chip.on:focus-visible,:root:not([data-theme=dark]) .chip.on:active,:root:not([data-theme=dark]) .icon-btn,:root:not([data-theme=dark]) .icon-btn:hover,:root:not([data-theme=dark]) .icon-btn:focus-visible,:root:not([data-theme=dark]) .icon-btn:active,:root:not([data-theme=dark]) .lang-btn,:root:not([data-theme=dark]) .lang-btn:hover,:root:not([data-theme=dark]) .lang-btn:focus-visible,:root:not([data-theme=dark]) .lang-btn:active,:root:not([data-theme=dark]) .rc-ico,:root:not([data-theme=dark]) .rc-ico:hover,:root:not([data-theme=dark]) .rc-ico:focus-visible,:root:not([data-theme=dark]) .rc-ico:active,:root:not([data-theme=dark]) .rc-actions a,:root:not([data-theme=dark]) .rc-actions a:hover,:root:not([data-theme=dark]) .rc-actions a:focus-visible,:root:not([data-theme=dark]) .rc-actions a:active,:root:not([data-theme=dark]) .linkbtn.btnish,:root:not([data-theme=dark]) .linkbtn.btnish:hover,:root:not([data-theme=dark]) .linkbtn.btnish:focus-visible,:root:not([data-theme=dark]) .linkbtn.btnish:active{border-color:#cfd6de!important}
/* header icon buttons (language, theme, menu): same 6px corners and 2px frame as the other buttons */
.bar-end .icon-btn{border-radius:6px!important;border-width:2px}
:root[data-theme=light] .bar-end .icon-btn,:root:not([data-theme=dark]) .bar-end .icon-btn{border-color:#cfd6de!important}
/* home slider "More information": no frame (both themes) */
.vslider .btn.btn-ico,.vslider .btn.btn-ico:hover,.vslider .btn.btn-ico:focus-visible,:root[data-theme=light] .vslider .btn.btn-ico,:root:not([data-theme=dark]) .vslider .btn.btn-ico{box-shadow:none!important}
/* light theme: yellow buttons without the frame (dark theme keeps its look) */
:root[data-theme=light] .btn.btn-ico,:root[data-theme=light] .btn.btn-ico:hover,:root[data-theme=light] .btn.btn-ico:focus-visible,:root[data-theme=light] .btn.btn-ico:active,
:root:not([data-theme=dark]) .btn.btn-ico,:root:not([data-theme=dark]) .btn.btn-ico:hover,:root:not([data-theme=dark]) .btn.btn-ico:focus-visible,:root:not([data-theme=dark]) .btn.btn-ico:active,
:root[data-theme=light] .btn-signal,:root:not([data-theme=dark]) .btn-signal,:root[data-theme=light] .bar .btn,:root:not([data-theme=dark]) .bar .btn,:root[data-theme=light] .to-top,:root:not([data-theme=dark]) .to-top,
:root[data-theme=light] .cta-row .btn-signal[data-i],:root:not([data-theme=dark]) .cta-row .btn-signal[data-i]{box-shadow:none!important}
/* mobile: the home slider tab strip never makes the page wider than the screen */
.vslider{max-width:100vw;overflow:hidden}.vs-tabs{overflow:hidden}.vs-tab{min-width:0}
/* smooth page transitions (cross-document View Transitions): the page fades and rises softly, the header stays put, a product card's picture glides into the product's lead media */
@view-transition{navigation:auto}
.site-header{view-transition-name:site-header}
.ph-vid,.ph-img{view-transition-name:pimg}
::view-transition-group(root){animation-duration:.4s}
::view-transition-old(root){animation:vt-out .2s cubic-bezier(.4,0,1,1) both}
::view-transition-new(root){animation:vt-in .42s cubic-bezier(.16,.84,.3,1) both}
::view-transition-group(pimg){animation-duration:.5s;animation-timing-function:cubic-bezier(.16,.84,.3,1)}
::view-transition-old(pimg),::view-transition-new(pimg){height:100%;object-fit:cover;border-radius:12px}
@keyframes vt-out{to{opacity:0;transform:translateY(-8px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(16px)}}
@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
/* footer: product lines shown as their wordmark lockups */
.lockup.th{--w:513.5;--l:32.69}
.foot-grid a.foot-logo{display:block;padding:5px 0;line-height:0}
.foot-logo .lockup{--u:.34px}
:root[data-theme=light] .foot-logo .lockup,:root:not([data-theme=dark]) .foot-logo .lockup{color:#33465A}
.foot-logo .lockup b{color:#93A7B0}
.foot-grid a.foot-logo:hover .lockup{filter:brightness(1.12)}.foot-grid a.foot-logo:hover{text-decoration:none}
/* all yellow buttons without a frame (light and dark) */
.btn.btn-ico,.btn.btn-ico:hover,.btn.btn-ico:focus-visible,.btn.btn-ico:active,.btn-signal,.bar .btn,.to-top,.cta-row .btn-signal[data-i]{box-shadow:none!important}
/* light theme: white header and footer for better logo contrast (page strips keep the pale blue-green) */
:root[data-theme=light] .site-header,:root:not([data-theme=dark]) .site-header,
:root[data-theme=light] .site-footer,:root:not([data-theme=dark]) .site-footer{background:#fff}
@media (max-width:960px){:root[data-theme=light] .site-header,:root:not([data-theme=dark]) .site-header{background:#fff}}
/* product lines shown as their wordmark lockups (section headings and product-line cards) */
.lockup.lk-h{--u:.4px;vertical-align:middle;margin-left:4px;top:-2px}
.sec-head h2 .lockup.lk-h{display:inline-block}
a.kindcard .prodcard-body{container-type:inline-size}
.lockup.lk-card{--u:min(.5px,calc(100cqw / 566));display:block}
a.kindcard .prodcard-body h3{line-height:0;margin:2px 0 8px}
:root[data-theme=light] .lockup.lk-card,:root[data-theme=light] .lockup.lk-h,:root:not([data-theme=dark]) .lockup.lk-card,:root:not([data-theme=dark]) .lockup.lk-h{color:#33465A}
:root[data-theme=dark] .lockup.lk-card,:root[data-theme=dark] .lockup.lk-h{color:#fff}
/* product-line cards: the wordmark logo is centred in the text part */
a.kindcard .prodcard-body h3{display:flex;justify-content:center}
a.kindcard .lockup.lk-card{margin-inline:auto}
/* product names as wordmark lockups without the frame – Nunito Italic 600 for numerals (design manual §02) */
@font-face{font-family:NunitoI;font-style:italic;font-weight:600;font-display:swap;src:url(fonts/nunito-italic-600.ttf)}
.lockup.nf{height:calc(93.2*var(--u));width:calc(var(--w)*var(--u))}
.lockup.nf::before{display:none}
.lockup .sx{font-style:italic;font-weight:600;letter-spacing:-.01em;color:inherit}
.lockup .sx-num{font-family:NunitoI,Barlow,Helvetica,Arial,sans-serif}
.lockup .sx-let{font-family:Barlow,Helvetica,Arial,sans-serif}
.lockup.nf.nm{--u:min(.5095px,calc(100cqw / var(--w)));display:block;line-height:0}
:root[data-theme=light] .lockup.nf.nm,:root:not([data-theme=dark]) .lockup.nf.nm{color:#33465A}
:root[data-theme=dark] .lockup.nf.nm{color:#fff}
/* product-line cards (home + products): wordmark logo and description centred horizontally and vertically */
a.kindcard .prodcard-body{display:flex;flex-direction:column;padding-top:30px}
a.kindcard .prodcard-body h3{margin:auto 0 12px;display:flex;justify-content:center}
a.kindcard .prodcard-body p{margin:0 0 auto;text-align:center}
a.kindcard .prodcard-foot{margin-top:26px}
/* product-line cards: all four logos on the same line (fixed distance below the picture), descriptions follow centred */
a.kindcard .prodcard-body{padding-top:36px}
a.kindcard .prodcard-body h3{margin:0 0 14px}
a.kindcard .prodcard-body p{margin:0 0 auto}
/* product cards: the lower part (divider + "I want to know more…") sits at the same height in every card of a row; the title and description above it follow the card size */
a.prodcard:not(.kindcard){align-self:stretch}
a.prodcard:not(.kindcard) .prodcard-body{flex:1 1 auto;display:flex;flex-direction:column;padding-bottom:20px!important}
a.prodcard:not(.kindcard) .prodcard-foot{margin-top:auto!important}
a.prodcard:not(.kindcard) .prodcard-body p{margin-bottom:14px}
a.prodcard:not(.kindcard) .prodcard-foot{min-height:69px;box-sizing:border-box;align-items:center}
a.prodcard:not(.kindcard):not(.feat) .prodcard-foot{padding-top:14px}
/* DARK THEME: all cards use the light-theme card design in dark colours – charcoal two-tone, thin light-grey frame, same slanted band and corners, no navy and no yellow edge */
:root[data-theme=dark] {--card-edge:#3a424b;--pop-hover:#2d353c;--lt-a:#2b3139;--lt-b:#1f242a;--lt-a2:#323a43;--lt-b2:#252b32;--lt-sub:#b9c8d0}
:root[data-theme=dark] .bcard,:root[data-theme=dark] article.rcard,:root[data-theme=dark] a.prodcard .prodcard-body,:root[data-theme=dark] a.routecard .prodcard-body,:root[data-theme=dark] article.ncard .ncard-body,:root[data-theme=dark] .doc-video .doc-body,:root[data-theme=dark] .excard .ex-body,:root[data-theme=dark] .art-card,:root[data-theme=dark] article.ncard:has(.ncard-art),:root[data-theme=dark] .pc-head,:root[data-theme=dark] .doc:not(.doc-video) .doc-body,:root[data-theme=dark] .art-body blockquote,:root[data-theme=dark] .person,:root[data-theme=dark] .cm-card{background:linear-gradient(135deg,#2b3139 0%,#1f242a 100%)}
:root[data-theme=dark] article.rcard:hover,:root[data-theme=dark] article.rcard.on,:root[data-theme=dark] a.prodcard:hover .prodcard-body,:root[data-theme=dark] a.prodcard:focus-visible .prodcard-body,:root[data-theme=dark] a.routecard:hover .prodcard-body,:root[data-theme=dark] article.ncard:hover .ncard-body,:root[data-theme=dark] article.ncard:focus-within .ncard-body,:root[data-theme=dark] .doc-video:hover .doc-body,:root[data-theme=dark] .excard:hover .ex-body,:root[data-theme=dark] .doc:not(.doc-video):hover .doc-body{background:linear-gradient(135deg,#323a43 0%,#252b32 100%)}
:root[data-theme=dark] .bcard,:root[data-theme=dark] .art-card,:root[data-theme=dark] article.rcard,:root[data-theme=dark] .person,:root[data-theme=dark] .cm-card{border-color:#3a424b}
:root[data-theme=dark] .bcard::before,:root[data-theme=dark] a.prodcard .prodcard-body::before{display:none}
/* product card arrow: navy circle + arrow in the light theme (yellow stays in the dark theme) */
:root[data-theme=light] .prodcard-go .go-no,:root:not([data-theme=dark]) .prodcard-go .go-no{color:#33465A}
/* HOME – "Seen on screen": cinematic credits strip (poster-format cards, scrolls by itself, hover enlarges, arrows) */
section.credits{background:#0d0f10;color:#e6ebee;padding:54px 0 46px;overflow:hidden}
section.credits .sec-head h2,:root[data-theme=light] section.credits .sec-head h2{color:#fff!important}
.cs-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:26px}
.cs-head .sec-head{margin:0 0 14px}
.cs-hint{margin:0;max-width:260px;color:#8fa0aa;font-size:.88rem;line-height:1.45;text-align:right}
.cs-award{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-weight:600;font-size:.88rem;color:#dfe6ea}
.cs-award i{font-style:normal;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--signal);color:#141618;font-weight:800}
.cs-scroller{overflow-x:auto;overflow-y:visible;scrollbar-width:none;padding:26px 6px 30px;margin:-8px -6px -10px}
.cs-scroller::-webkit-scrollbar{display:none}.cs-scroller:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
.cs-track{display:flex;gap:16px;width:max-content}
.cs{position:relative;flex:none;width:clamp(190px,17vw,240px);aspect-ratio:2/3;border-radius:6px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:18px 16px 16px;color:#fff;background:#222a31;border:1px solid rgba(255,255,255,.08);transition:transform .45s cubic-bezier(.16,.84,.3,1),box-shadow .45s,filter .45s;will-change:transform}
.cs.v0{background:linear-gradient(165deg,#3f5468 0%,#1c2630 70%)}.cs.v1{background:linear-gradient(165deg,#27406a 0%,#12192a 75%)}.cs.v2{background:linear-gradient(165deg,#4a5560 0%,#1b1f24 75%)}.cs.v3{background:linear-gradient(165deg,#5b7280 0%,#202a31 75%)}
.cs::before{content:"";position:absolute;top:-10%;bottom:-10%;right:-30px;width:90px;background:rgba(255,255,255,.07);transform:skewX(-14deg);pointer-events:none}
.cs>*{position:relative;z-index:1}.cs img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.cs.has-img::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.85) 0,rgba(0,0,0,0) 55%);z-index:0}
.cs .yr{font:600 .7rem/1.3 var(--font);letter-spacing:.16em;text-transform:uppercase;color:#c4d0dc}
.cs h3{margin:0;font:italic 800 clamp(1.5rem,2.1vw,2.1rem)/1 var(--font);text-transform:uppercase;letter-spacing:-.015em;color:#fff;overflow-wrap:anywhere}
.cs-foot{display:flex;flex-direction:column;gap:8px}.cs .why{margin:0;font-size:.82rem;line-height:1.35;color:#dfe6ea}
.cs .crane{display:flex;align-items:center;gap:8px;font-weight:700;font-size:.82rem;padding-top:8px;border-top:1px solid rgba(255,255,255,.2)}
.cs .crane::before{content:"";width:.55em;height:.55em;background:var(--signal);transform:skewX(-14deg)}
.cs-track:hover .cs{filter:brightness(.7)}.cs-track .cs:hover{filter:none;transform:scale(1.08);z-index:3;box-shadow:0 24px 44px -12px rgba(0,0,0,.85)}
.cs-nav{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}
.cs-nav button{width:54px;height:54px;border-radius:4px;border:2px solid rgba(255,255,255,.35);background:transparent;color:#fff;font-size:1.5rem;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.cs-nav button:hover,.cs-nav button:focus-visible{background:var(--signal);border-color:var(--signal);color:#141618}
@media (max-width:640px){.cs-hint{text-align:left}.cs{width:62vw}}
/* Back to top: plain button with the simple frame used in the header (both themes) */
.to-top{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:6px;border:2px solid #cfd6de;background:transparent!important;color:var(--heading)!important;font:600 .92rem/1 var(--font);cursor:pointer;box-shadow:none!important;transition:background .2s,border-color .2s}
.to-top::before{content:"↑";width:auto;height:auto;background:none!important;-webkit-mask:none;mask:none;font-size:1.1em;line-height:1}
.to-top:hover,.to-top:focus-visible{background:rgba(51,70,90,.08)!important;border-color:#93A7B0;filter:none}
:root[data-theme=dark] .to-top{border-color:#3a424b;color:#e6ebee!important}
:root[data-theme=dark] .to-top:hover,:root[data-theme=dark] .to-top:focus-visible{background:rgba(255,255,255,.08)!important;border-color:#6b7c8c}
/* credits strip: LIGHT variant (light two-tone cards, light frame, navy text) – dark variant uses the dark surface colour instead of near-black */
:root[data-theme=dark] section.credits{background:#1b1e21}
:root[data-theme=light] section.credits,:root:not([data-theme=dark]) section.credits{background:#fff;color:#33465A;border-top:1px solid #dfe4ea;border-bottom:1px solid #dfe4ea}
:root[data-theme=light] section.credits .sec-head h2,:root:not([data-theme=dark]) section.credits .sec-head h2{color:#33465A!important}
:root[data-theme=light] .cs-hint,:root:not([data-theme=dark]) .cs-hint{color:#6b7c8c}
:root[data-theme=light] .cs-award,:root:not([data-theme=dark]) .cs-award{color:#33465A}
:root[data-theme=light] .cs-award i,:root:not([data-theme=dark]) .cs-award i{background:var(--signal);color:#141618}
:root[data-theme=light] .cs,:root:not([data-theme=dark]) .cs{color:#33465A;border:2px solid #cfd6de;border-radius:14px;box-shadow:0 14px 30px -18px rgba(20,22,24,.55)}
:root[data-theme=light] .cs.v0,:root:not([data-theme=dark]) .cs.v0{background:linear-gradient(165deg,#f4f6f8 0%,#dfe4ea 100%)}
:root[data-theme=light] .cs.v1,:root:not([data-theme=dark]) .cs.v1{background:linear-gradient(165deg,#fafbfc 0%,#e7ebf0 100%)}
:root[data-theme=light] .cs.v2,:root:not([data-theme=dark]) .cs.v2{background:linear-gradient(165deg,#eef1f4 0%,#d6dde5 100%)}
:root[data-theme=light] .cs.v3,:root:not([data-theme=dark]) .cs.v3{background:linear-gradient(165deg,#f6f8fa 0%,#dde3ea 100%)}
:root[data-theme=light] .cs::before,:root:not([data-theme=dark]) .cs::before{background:rgba(255,255,255,.6)}
:root[data-theme=light] .cs .yr,:root:not([data-theme=dark]) .cs .yr{color:#6b7c8c}
:root[data-theme=light] .cs h3,:root:not([data-theme=dark]) .cs h3{color:#33465A}
:root[data-theme=light] .cs .why,:root:not([data-theme=dark]) .cs .why{color:#44566c}
:root[data-theme=light] .cs .crane,:root:not([data-theme=dark]) .cs .crane{color:#33465A;border-top-color:rgba(26,41,64,.18)}
:root[data-theme=light] .cs-track:hover .cs,:root:not([data-theme=dark]) .cs-track:hover .cs{filter:brightness(.94)}
:root[data-theme=light] .cs.has-img,:root:not([data-theme=dark]) .cs.has-img{color:#fff}
:root[data-theme=light] .cs.has-img h3,:root[data-theme=light] .cs.has-img .why,:root[data-theme=light] .cs.has-img .crane,:root[data-theme=light] .cs.has-img .yr,:root:not([data-theme=dark]) .cs.has-img h3,:root:not([data-theme=dark]) .cs.has-img .why,:root:not([data-theme=dark]) .cs.has-img .crane,:root:not([data-theme=dark]) .cs.has-img .yr{color:#fff}
:root[data-theme=light] .cs-nav button,:root:not([data-theme=dark]) .cs-nav button{border-color:#cfd6de;color:#33465A}
:root[data-theme=light] .cs-nav button:hover,:root[data-theme=light] .cs-nav button:focus-visible,:root:not([data-theme=dark]) .cs-nav button:hover,:root:not([data-theme=dark]) .cs-nav button:focus-visible{background:rgba(51,70,90,.08);border-color:#93A7B0;color:#33465A}
/* dark variant: the "Need a crane for your next shoot?" strip in a colour we already use as dark background (surface) instead of navy */
:root[data-theme=dark] .cta-band{background:#1f242a;border-top:1px solid #2c3237;border-bottom:1px solid #2c3237}