/* Shared Contec palette, typography and spacing for every section. */
@font-face{font-family:Manrope;src:url('/assets/fonts/Manrope-Variable.ttf') format('truetype');font-style:normal;font-weight:200 800;font-display:swap}
:root{--ink:#0a1423;--paper:#0a1423;--surface:#0a1423;--blue:#0088fd;--blue-light:#58b6ff;--text:#f5f7fc;--muted:#a1b0c5;--line:#ffffff21;--font-ui:Manrope,Arial,sans-serif}
html,body{background:var(--ink)}
body{font-family:var(--font-ui);font-weight:400;line-height:1.6}
button,input,select,textarea{font-family:var(--font-ui)}
.hero,.services,.references,.management-section,.contact,.site-footer,.section-light,.section-dark{color:var(--text)}
/* Distinct, coordinated chapter backgrounds keep the long page easy to scan. */
.hero{background:#0a1423}
.services{background:#152c45}
.management-section{background:#070c13}
.references{background:#102238}
.contact{background:#080f1a}
.site-footer{background:linear-gradient(180deg,#0e1b2d,#13243a)}
.services,.management-section,.references,.contact,.site-footer{border-top:1px solid #ffffff12}
.hero::before{background:none}.site-header{background:linear-gradient(180deg,#132239,#0e1a2c);border-bottom-color:#ffffff12}
.hero-stage,.trade-switch,.trade-tabs,.success-card,.contact-form,dialog{background:var(--surface);border-color:var(--line);box-shadow:none}
.hero-stage{background:#101e31;box-shadow:inset 0 0 65px #0088fd05}
.trade-switch{background:#0b1829;border-color:#ffffff25}
.trade-tabs{background:#102139;border-bottom-color:#ffffff20}
.success-card{background:#091523;border-color:#ffffff20}
.contact-form{background:#112137;border-color:#ffffff24}
.mobile-menu{background:#112138;border-color:#ffffff16;box-shadow:0 24px 45px #07122255}
.desktop-nav a{color:#c9d6e7}.desktop-nav a:hover{color:#fff}
.desktop-nav a::after{background:var(--blue)}
.site-header .header-contact{background:#0088fd12;border-color:#5f88ad66}
.site-header .header-contact:hover{background:var(--blue);border-color:var(--blue)}
.site-footer .footer-top{border-bottom-color:#ffffff12}
.site-footer .footer-bottom{color:#a4b5cb}
.section-dark .muted,.muted{color:var(--muted)}
h1,h2,h3,h4{font-family:var(--font-ui);font-weight:500;letter-spacing:-.045em}
.hero-copy h1{font-size:clamp(3.1rem,5.15vw,5.7rem);line-height:1.1}
.services-lead h2,.management-content>h2,.center-heading>h2,.contact-heading h2{font-size:clamp(2.35rem,4.1vw,4.4rem);line-height:1.15;letter-spacing:-.045em}
.trade-copy h3{font-size:clamp(2.2rem,3.2vw,3.25rem);line-height:1.14;margin:15px 0 18px}
.trade-copy>p:not(.eyebrow),.management-promise,.center-service p,.contact-heading p,.hero-copy .hero-intro p{font-size:1rem;line-height:1.7;color:#b9c8da;max-width:40ch}
.trade-copy strong,.management-promise strong,.owner-statement strong{font-weight:650}
.eyebrow,.section-meta .eyebrow,.trade-copy .eyebrow,.management-content>.eyebrow{font-size:.75rem;font-weight:600;letter-spacing:.11em;line-height:1.5;color:#a1b3cb}
.section-meta{margin-bottom:24px;padding-bottom:12px}
.services,.references,.management-section{padding:60px 0}
.services-lead,.center-heading{margin-bottom:28px}
.button,.trade-detail .button,.management-content .button,.center-service .button,.success-cta,.contact-form .button{font-size:.875rem;font-weight:600;letter-spacing:0;line-height:1.45;min-height:54px;padding:15px 19px;gap:20px;border-radius:3px}
.hero-action{min-height:56px;border-radius:3px}.hero-action strong{font-weight:600;font-size:.9375rem}
.header-contact{font-size:.8125rem;font-weight:600;border-radius:3px}
.button-blue,.hero-action-primary{background:var(--blue)}
.button-blue:hover,.hero-action-primary:hover{background:#0078e3}
.trade-switch,.hero-stage,.success-card,.contact-form{border-radius:5px}
.trade-tabs{padding:7px}.trade-tabs button{padding:15px;font-weight:500}.trade-tabs button strong{font-size:1.125rem;font-weight:650}.trade-tabs button span{font-size:.875rem}
.trade-indicator{top:7px;bottom:7px;left:7px;width:calc(50% - 7px);border-radius:2px}
/* Both panels occupy one grid cell, so the larger content sets one stable height.
   The inactive panel stays invisible, inert and excluded from assistive technology. */
.trade-panels{display:grid;min-height:0}
.trade-panels>.trade-panel{grid-area:1/1;align-self:stretch;align-content:start;grid-template-rows:auto 220px;padding:30px;column-gap:36px}
.trade-panels>.trade-panel[hidden]{display:grid!important;visibility:hidden;pointer-events:none}
.trade-detail{height:100%;min-height:0;gap:18px}
.trade-detail .button{margin-top:auto}
.trade-points{padding-left:0}.trade-points li{font-size:.9375rem;line-height:1.55;padding:13px 0;align-items:baseline;border-color:var(--line)}
.trade-points li::before{width:5px;height:5px;flex-basis:5px;margin-top:0}
.trade-panel>.trade-visual{align-self:end;height:220px;max-width:410px}
.owner-statement h3,.center-service h3{font-size:clamp(1.65rem,2.5vw,2.6rem);line-height:1.2;font-weight:500;letter-spacing:-.035em}
.owner-statement p{font-size:1.0625rem;line-height:1.7;font-weight:500;color:#bdccdd}
.management-points li{font-size:.9375rem;line-height:1.6}
.success-photo-caption h3{font-weight:500;letter-spacing:-.03em}.success-photo-caption>span{font-size:.8125rem}
.success-copy h4{font-size:1.25rem;font-weight:500;letter-spacing:-.025em;margin-top:0}
.success-copy p{font-size:.875rem;line-height:1.6;color:#b9c8da}
.graph-values>strong{font-weight:500;letter-spacing:-.055em}.graph-values small{font-size:.75rem;font-weight:400}
.contact-form label{font-size:.8125rem;font-weight:600;letter-spacing:0;color:#c4d2e2}
.contact-form input,.contact-form select,.contact-form textarea{background:#ffffff03;border-color:#ffffff2d;border-radius:3px;font-size:.9375rem;line-height:1.55;caret-color:var(--blue)}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--blue);outline:1px solid var(--blue)}
.contact-form option{background:var(--ink);color:var(--text)}
.contact-mail{font-size:clamp(1rem,1.5vw,1.35rem);letter-spacing:-.025em}.contact-mail-copy small{font-size:.8125rem;color:var(--muted)}
.contact-phone{font-size:1.125rem;font-weight:500}.contact-address,.footer-bottom,.text-link,.scroll-link,.back-top{font-size:.8125rem}
.footer-top{border-color:var(--line)}.site-footer .footer-slogan{font-weight:400}
@media(hover:hover) and (pointer:fine){body,body a,body button,body select,body summary,body canvas{cursor:url('/assets/contec-cursor.svg') 4 2,auto}body input,body textarea{cursor:text}}
@media(max-width:850px){.trade-panels>.trade-panel{padding:26px;column-gap:24px}.trade-copy h3{font-size:2.25rem}.hero-copy h1{font-size:clamp(3.1rem,7.2vw,4.6rem)}}
@media(max-width:650px){.services,.references,.management-section{padding:42px 0}.hero-copy h1{font-size:clamp(2.9rem,11vw,4.25rem)}.services-lead h2,.management-content>h2,.center-heading>h2,.contact-heading h2{font-size:clamp(2.1rem,8.3vw,3.1rem)}.services-lead h2{font-size:clamp(1.85rem,7.5vw,2.8rem)}.trade-panels>.trade-panel{padding:24px 21px;grid-template-rows:auto auto 180px;gap:19px}.trade-copy h3{font-size:clamp(2.1rem,8.7vw,2.8rem)}.trade-copy>p:not(.eyebrow){font-size:.9375rem}.trade-points li{padding:11px 0;font-size:.875rem}.trade-panel>.trade-visual{height:180px}.trade-tabs button{padding:12px 8px}.trade-tabs button span{font-size:.75rem}.trade-tabs button strong{font-size:1.0625rem}.section-meta{margin-bottom:21px}.services-lead,.center-heading{margin-bottom:23px}.success-copy h4{font-size:1.2rem}.contact-form{padding:24px 20px}}

.owner-statement p .owner-reason{color:var(--blue)}
.site-footer .footer-slogan{font-family:var(--font-ui);font-weight:500;letter-spacing:-.035em;line-height:1.4;text-shadow:none}
.site-footer .footer-slogan::before{height:2px;opacity:.8}
.success-graph{height:120px;margin-top:12px}
.graph-line{stroke:var(--blue);stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 2px 5px #0088fd35)}
.graph-grid{stroke:#ffffff09}
.graph-values small{line-height:1.5}
@media(max-width:650px){.success-graph{height:105px}.site-footer .footer-slogan{font-size:clamp(1.05rem,4.4vw,1.55rem)}}

/* The company promise leads; services and contact actions follow immediately. */

.hero-service-summary{display:flex;flex-wrap:wrap;gap:8px 18px;list-style:none;padding:0;margin:0;color:#e4edf8;font-size:clamp(.875rem,1.08vw,1rem);font-weight:600;line-height:1.6}
.hero-service-summary li{display:flex;align-items:center;gap:8px;white-space:nowrap}
.hero-service-summary li::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--blue);flex:0 0 4px}
@media(max-width:650px){.hero-service-summary{gap:7px 14px;font-size:.875rem}.hero-copy .hero-intro{margin-top:18px}}

/* Two phrases share the same three lines, preserving the complete hero layout. */
.hero-copy #hero-heading .slogan-line{display:grid;position:relative;overflow:hidden;color:var(--text);padding:.055em 0;margin:-.055em 0;line-height:1.1}
.hero-copy #hero-heading .slogan-line>span{grid-area:1/1;color:inherit;white-space:nowrap}
.hero-copy #hero-heading .slogan-accent{color:var(--blue-light)}
.slogan-next{visibility:hidden}
.slogan-complete .slogan-first{visibility:hidden}
.slogan-complete .slogan-next{visibility:visible}
.footer-identity{display:flex;align-items:center;gap:34px;min-width:0}
.footer-address{font-style:normal;font-size:.9375rem;line-height:1.65;color:#bacbdf;border-left:1px solid #ffffff25;padding-left:30px}
@media(max-width:650px){.site-footer .footer-top{flex-wrap:wrap;gap:20px}.footer-identity{gap:20px}.site-footer .footer-identity .brand{width:115px;flex-basis:115px}.footer-address{font-size:.875rem;padding-left:20px}.site-footer .back-top{margin-left:auto}.hero-copy #hero-heading{font-size:clamp(2.3rem,9.9vw,4.1rem)}}

/* Larger rendered service scenes share one stable frame in both tabs. */
.trade-panels>.trade-panel{grid-template-rows:auto 280px}
.trade-panel>.trade-visual{height:280px;max-width:373.333px}
.trade-film{overflow:hidden;border-radius:5px;background:#0b1829}
.trade-film video{display:block;width:100%;height:100%;object-fit:contain}
@media(max-width:650px){.trade-panels>.trade-panel{grid-template-rows:auto auto auto}.trade-panel>.trade-visual{height:auto;aspect-ratio:4/3;max-width:306.667px}}

/* Both overlapping tabs contribute to the same row sizes, including the hidden tab.
   Shared tracks align the copy endings, calls to action and films at every width. */
.trade-panels{grid-template-rows:auto auto;row-gap:8px}
.trade-panels>.trade-panel{grid-column:1;grid-row:1 / -1;grid-template-rows:subgrid;align-content:normal}
.trade-copy{display:flex;flex-direction:column;align-self:stretch}
.trade-copy>p:last-child{margin-top:auto}
@media(max-width:650px){.trade-panels{grid-template-rows:auto auto auto;row-gap:19px}}

/* A brief satin-like highlight leaves the letting milestone calm between sweeps. */
.fully-let{display:inline-block;color:#c9b17b;font-weight:600}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
  .fully-let{background-image:linear-gradient(110deg,#c9b17b 0%,#c9b17b 42%,#f5e8c2 50%,#c9b17b 58%,#c9b17b 100%);background-size:250% 100%;background-position:100% 50%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:fully-let-shine 8s ease-in-out infinite}
}
@keyframes fully-let-shine{0%,75%{background-position:100% 50%}95%,100%{background-position:0% 50%}}
.management-promise strong{color:var(--text)}
.services-lead h2{white-space:normal;text-wrap:balance}
.vacancy-invitation{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;margin-top:16px;padding-left:16px;border-left:2px solid var(--blue)}
.vacancy-invitation h4{color:var(--blue-light);font-weight:600;margin-bottom:4px}
.vacancy-invitation p{margin:0}
.vacancy-invitation .vacancy-cta{margin:0;min-height:46px;padding:11px 13px;gap:12px;background:#0088fd10;border:1px solid #58b6ff66;color:var(--text);font-size:.8125rem;width:172px;max-width:100%;white-space:normal}
/* The label is text, so it must not inherit the global arrow-span sizing. */
.vacancy-cta>span{display:block;flex:1 1 auto;min-width:0;font:inherit;line-height:inherit;white-space:normal;overflow-wrap:anywhere}
.vacancy-invitation .vacancy-cta:hover{background:#0088fd26;border-color:var(--blue-light)}
.vacancy-invitation .vacancy-cta:focus-visible{outline:2px solid var(--blue-light);outline-offset:4px}
.vacancy-cta .arrow-icon{width:18px;height:18px;flex-shrink:0}
@media(prefers-reduced-motion:reduce){.fully-let{animation:none;background:none;color:#c9b17b}}
@media(forced-colors:active){.fully-let{animation:none;background:none;color:CanvasText}}
@media(max-width:1100px){.vacancy-invitation{gap:12px;padding-left:12px}.vacancy-invitation .vacancy-cta{width:116px;padding:11px 9px;text-align:center;justify-content:center}.vacancy-cta .arrow-icon{display:none}.vacancy-copy{min-width:0}.vacancy-copy h4{font-size:1.0625rem}}
@media(max-width:650px){.vacancy-invitation{gap:10px}.vacancy-invitation .vacancy-cta{width:108px}.vacancy-copy{hyphens:auto;overflow-wrap:break-word}}

/* Quiet trust statement; the blue light appears only while the pointer is over it. */
.hero-copy .hero-experience{--energy-x:50%;--energy-y:50%;position:relative;isolation:isolate;width:fit-content;max-width:100%;margin:19px 0 0;padding:0 0 10px;border-bottom:1px solid #ffffff1c;line-height:1.55;color:#aebfd4}
.hero-experience strong{display:block;font-size:1rem;font-weight:600;letter-spacing:-.012em;color:#e5edf7}
.experience-copy>span,.experience-energy>span{display:block;font-size:.875rem}
.experience-copy{position:relative;z-index:1}
.experience-energy{display:none;position:absolute;inset:0;padding:inherit;pointer-events:none;user-select:none;opacity:0;transition:opacity .4s ease}
.hero-experience::before,.hero-experience::after{content:'';position:absolute;pointer-events:none;opacity:0;transition:opacity .4s ease}
.hero-experience::before{inset:-10px -12px;background:radial-gradient(ellipse 105px 38px at calc(var(--energy-x) + 12px) calc(var(--energy-y) + 10px),#0088fd19,transparent 100%)}
.hero-experience::after{left:0;right:0;bottom:-1px;height:1px;background:radial-gradient(ellipse 75px 2px at var(--energy-x) 50%,#dcf4ff 0%,#58b6ff 24%,#0088fd88 55%,transparent 100%)}
.hero-experience+.hero-actions{margin-top:18px}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
  .experience-energy{display:block;z-index:2;color:transparent;background:radial-gradient(ellipse 90px 45px at var(--energy-x) var(--energy-y),#f2fbff 0%,#8bd4ff 23%,#0088fd 60%,transparent 100%);background-clip:text;-webkit-background-clip:text}
  .experience-energy strong{color:transparent}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .hero-experience.is-energized::before,.hero-experience.is-energized::after,.hero-experience.is-energized .experience-energy{opacity:1}
}
@media(prefers-reduced-motion:reduce){.hero-experience::before,.hero-experience::after,.experience-energy{display:none;transition:none}}
@media(forced-colors:active){.experience-energy,.hero-experience::before,.hero-experience::after{display:none}}

/* Larger process steps respond individually, without moving their shared layout. */
.trade-points li{position:relative;isolation:isolate;font-size:1.125rem;line-height:1.55;padding:14px 8px 14px 0;transition:color .3s ease,border-color .3s ease,transform .4s cubic-bezier(.22,1,.36,1)}
.trade-points li::before{transition:background .3s ease,box-shadow .3s ease,transform .4s ease}
.trade-points li::after{content:'';position:absolute;inset:3px -8px 3px -10px;z-index:-1;border-radius:3px;background:linear-gradient(90deg,#0088fd1c,transparent 90%);opacity:0;transform:translateX(-6px);pointer-events:none;transition:opacity .35s ease,transform .4s cubic-bezier(.22,1,.36,1)}
.trade-scope{font-size:1rem;line-height:1.65;color:#c1cfe0}
@media(hover:hover) and (pointer:fine){
  .trade-points li:hover{color:#fff;border-color:#58b6ff66;transform:translateX(5px)}
  .trade-points li:hover::before{background:#9bdcff;box-shadow:0 0 12px #0088fd80;transform:scale(1.35)}
  .trade-points li:hover::after{opacity:1;transform:translateX(0)}
}
@media(max-width:650px){.trade-points li{font-size:1.0625rem;padding-top:12px;padding-bottom:12px}}
@media(prefers-reduced-motion:reduce){.trade-points li,.trade-points li::before,.trade-points li::after{transition:none;transform:none!important}}

/* Direct contact delivery: compact, readable feedback on every viewport. */
.contact-form { position: relative; }
.contact-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.contact-form #contact-submit-label { font: inherit; color: inherit; width: auto; height: auto; flex: initial; }
.contact-form button:disabled { opacity: .65; cursor: progress; }
.contact-status { margin: 12px 0 0; padding: 12px 14px; border: 1px solid rgba(0,136,253,.32); border-radius: 10px; background: rgba(0,136,253,.08); color: #e2eaf5; font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.contact-status[data-state="success"] { border-color: rgba(107,216,167,.35); color: #b5f0d3; }
.contact-status[data-state="error"] { border-color: rgba(244,189,123,.35); color: #f2d6b3; }
.contact-fallback { display: inline-flex; align-items: center; gap: 8px; width: fit-content; max-width: 100%; padding: 10px 0; color: #77bcff; font-size: 14px; font-weight: 650; text-decoration: underline; text-underline-offset: 4px; }
.contact-fallback:focus-visible { outline: 2px solid #0088fd; outline-offset: 4px; }
.contact-status[hidden], .contact-fallback[hidden] { display: none; }