/* Premium visual layer. Kept separate so existing site settings and block markup remain stable. */
@font-face{font-family:"Plus Jakarta Sans";src:url("../Fonts/PlusJakartaSans%5Bwght%5D.ttf") format("truetype");font-style:normal;font-weight:200 800;font-display:swap}
:root{--font-sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--color-paper:#fcfcfa;--color-ink:#152235;--shadow-sm:0 4px 16px rgba(21,34,53,.05);--shadow:0 18px 48px rgba(21,34,53,.1);--shadow-lg:0 28px 80px rgba(21,34,53,.14);--radius-sm:6px;--radius-md:14px;--radius-pill:999px;--leading-normal:1.62;--measure:68ch}
.site-shell{background:var(--color-paper);color:var(--color-ink)}
.site-shell[data-palette="ocean"]{--color-bg:#fcfcfa;--color-bg-subtle:#f2f5f7;--color-bg-muted:#e7eef3;--color-border:#d8e1e6;--color-border-strong:#b8c8d1;--color-text:#152235;--color-text-muted:#566678}
.site-shell[data-palette="forest"]{--color-bg-subtle:#f4f8f4;--color-bg-muted:#e7f1e9;--color-border:#d8e5dc}
.site-shell[data-palette="plum"]{--color-bg-subtle:#faf7fa;--color-bg-muted:#f1eaf3;--color-border:#e7dce9}
.site-shell[data-palette="ember"]{--color-bg-subtle:#fbf7f3;--color-bg-muted:#f4eae2;--color-border:#eadfd6}
.site-shell[data-type-scale="expressive"]{--text-h1:clamp(3rem,6vw,5.6rem);--text-h2:clamp(2.2rem,3.7vw,3.6rem);--text-h3:clamp(1.35rem,2.3vw,1.85rem)}
.section{position:relative}
.section--subtle{border-block-color:transparent}
.section-header{max-width:48rem;margin-block-end:clamp(1.75rem,3vw,3rem)}
.section-header__kicker,.section__eyebrow,.hero__eyebrow{letter-spacing:.13em;font-weight:var(--font-weight-bold)}
.section-header__lead,.section__lead{font-size:clamp(1.05rem,1.5vw,1.25rem);max-width:58ch}
.section-header__title{max-width:20ch}
.section-header--center .section-header__title{margin-inline:auto}
.site-header{background:color-mix(in srgb,var(--color-bg) 94%,transparent);backdrop-filter:saturate(1.1) blur(18px);border-color:var(--color-border);box-shadow:0 5px 24px rgba(17,31,44,.045)}
.site-header__inner{min-height:4.75rem;gap:var(--space-md)}
.site-header__brand{flex-shrink:0;gap:.7rem}
.site-header__brand:focus-visible{outline:3px solid var(--color-focus);outline-offset:5px;border-radius:var(--radius-sm)}
.site-header__logomark{width:2.25rem;height:2.25rem;border-radius:11px;box-shadow:0 4px 12px color-mix(in srgb,var(--color-brand) 22%,transparent)}
.site-header__logotype{font-size:1.1rem;letter-spacing:-.04em}
.site-header__nav{margin-inline:auto}
.nav__list{gap:.2rem}
.site-header .nav__link{min-height:2.7rem;padding:.55rem .85rem;font-weight:var(--font-weight-semibold);border-radius:999px}
.site-header .nav__link::after,.site-header .nav__link::before{display:none}
.site-header .nav__link:hover,.site-header .nav__link--active{background:var(--color-bg-muted);color:var(--color-brand-ink)}
.site-header__actions{gap:.8rem;flex-wrap:nowrap}
.language-switch{gap:.125rem;padding:.22rem;background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:999px;font-size:var(--text-xs);font-weight:var(--font-weight-bold)}
.language-switch .language-switch__icon{display:grid;place-items:center;width:1.7rem;padding:0;color:var(--color-text-muted)}
.language-switch .language-switch__option{display:grid;place-items:center;min-width:2.2rem;min-height:2rem;padding:.25rem .4rem;border-radius:999px;color:var(--color-text-muted);line-height:1;text-align:center;text-decoration:none}
.language-switch .language-switch__option:hover{background:var(--color-bg-muted);color:var(--color-text)}
.language-switch .language-switch__option.is-active{background:var(--color-bg);color:var(--color-brand-ink);box-shadow:0 1px 5px rgba(17,31,44,.12)}
.language-switch .language-switch__option:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}
.language-switch .language-switch__code{display:block;min-width:0;padding:0;border-radius:0;color:inherit;text-transform:uppercase;letter-spacing:.03em}
.site-header__cta{border-radius:999px;min-height:2.7rem;padding-inline:1.15rem}
.site-header__cta::after{content:"";display:inline-block;width:.4rem;height:.4rem;margin-inline-start:.3rem;border-block-start:1.5px solid currentColor;border-inline-end:1.5px solid currentColor;transform:rotate(45deg)}
.btn{min-height:2.9rem;padding:.7rem 1.2rem;font-weight:var(--font-weight-semibold);border-radius:var(--radius-sm)}
.btn--sm{min-height:2.4rem;padding:.5rem .9rem}
.btn--lg{min-height:3.25rem;padding:.85rem 1.5rem}
.btn:hover{text-decoration:none}
.btn:focus-visible,.nav-toggle:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}
.badge{background:var(--color-bg-muted);border-color:var(--color-border);color:var(--color-brand-ink)}
.form__input:focus,.form__textarea:focus,.form__select:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--color-focus) 18%,transparent)}
.hero-section .hero{gap:clamp(2rem,5vw,5rem);min-height:0}
.hero-section .hero[data-image-position="left"] .hero__media,.hero-section .hero[data-image-position="left"] .hero__art{order:-1}
.hero-section .hero[data-media-crop="square"] .hero__media{aspect-ratio:1}
.hero-section .hero[data-media-crop="portrait"] .hero__media{aspect-ratio:4/5}
.hero-section .hero__content{gap:clamp(.85rem,1.6vw,1.5rem)}
.hero__title{max-width:13ch;line-height:1.04}
.hero__lead{font-size:clamp(1.05rem,1.6vw,1.3rem);max-width:43ch}
.hero__actions{margin-block-start:var(--space-sm)}
.hero__media{aspect-ratio:5/4;border:0;border-radius:var(--radius-md);box-shadow:0 24px 52px rgba(17,31,44,.13)}
.hero-section .hero__media{box-shadow:0 24px 52px rgba(17,31,44,.13)}
.hero__art{aspect-ratio:5/4;min-height:14rem;border:0;background:radial-gradient(circle at 76% 18%,rgba(255,255,255,.8),transparent 35%),linear-gradient(140deg,var(--color-bg-muted),var(--color-bg-subtle))}
.hero__art::before{background-size:3rem 3rem;opacity:.32}
.hero__art-ring{left:40%;top:-30%;width:72%;opacity:.16}
.hero__art-card--back{left:39%;top:27%;width:49%;height:49%;transform:rotate(8deg);opacity:.8}
.hero__art-card--front{left:14%;top:35%;width:51%;height:43%;transform:rotate(-5deg)}
.cards,.grid,.process,.pricing-grid,.gallery-grid{gap:clamp(1rem,2vw,1.5rem)}
.card,.project-card,.person-card,.testimonial,.pricing-card,.process__step{box-shadow:var(--shadow-sm);border-color:var(--color-border)}
.card,.project-card,.person-card,.pricing-card{transition:border-color var(--transition-base),box-shadow var(--transition-base)}
.card:hover,.project-card:hover,.person-card:hover,.pricing-card:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow)}
.card__body,.project-card__body,.person-card__body{padding:clamp(1.25rem,2vw,2rem)}
.service-card,.card--feature,.process__step,.testimonial{padding:clamp(1.3rem,2.2vw,2rem)}
.card__title{font-size:var(--text-h3);line-height:1.22}
.card__text,.process__text{font-size:var(--text-base)}
.card__icon{width:3rem;height:3rem;border-radius:12px}
.card__icon svg,.card__icon--custom{width:1.5rem;height:1.5rem;fill:none}
.card__icon--custom{padding:.75rem}
.card__media,.project-card__media{aspect-ratio:3/2}
.card__media img,.project-card__media img,.person-card__media img,.gallery-grid img{object-position:center}
.text-image{gap:clamp(2rem,5vw,5rem)}
.text-image__media,.contact__media{border:0;aspect-ratio:5/4}
.text-image__content{gap:var(--space-lg)}
.text-image__lead{font-size:clamp(1.05rem,1.5vw,1.25rem)}
.stats{gap:var(--space-xl);border-color:var(--color-border-strong)}
.stats__value,.stat__value{font-size:clamp(2rem,3.5vw,3.25rem)}
.faq__question{min-height:3.75rem;font-weight:var(--font-weight-semibold)}
.faq__question:focus-visible{outline:3px solid var(--color-focus);outline-offset:-4px}
.cta{padding:clamp(2rem,5vw,4.5rem)}
.cta__text{font-size:clamp(1.05rem,1.5vw,1.25rem)}
.pricing-card{padding:clamp(1.5rem,2.5vw,2.25rem)}
.pricing-card--featured{padding:calc(clamp(1.5rem,2.5vw,2.25rem) - 1px)}
.gallery-grid a{border-radius:var(--radius-md)}
.gallery-grid a img{transition:transform var(--transition-base)}
.gallery-grid a:hover img{transform:scale(1.025)}
.site-footer{padding-block:clamp(3rem,6vw,5rem) var(--space-xl)}
.site-footer__prelude{border:0;box-shadow:var(--shadow)}
.site-footer__prelude-title{max-width:18ch}
.form__input,.form__textarea,.form__select{min-height:3rem;padding:.7rem .85rem}
/* Native TYPO3 content can sit between Crispframe blocks without custom templates. */
.page>.frame:not([class*="frame-type-crispframe_"]){width:min(100% - 2*var(--container-gutter),var(--container-default));margin:var(--space-2xl) auto;color:var(--color-text)}
.page>.frame:not([class*="frame-type-crispframe_"]):first-child{margin-block-start:var(--space-3xl)}
.frame-type-text,.frame-type-textmedia,.frame-type-textpic,.frame-type-table,.frame-type-uploads{overflow-wrap:anywhere}
.frame-type-text .ce-bodytext,.frame-type-textmedia .ce-bodytext,.frame-type-textpic .ce-bodytext{max-width:72ch;line-height:var(--leading-normal)}
.frame-type-text .ce-bodytext>*+*,.frame-type-textmedia .ce-bodytext>*+*,.frame-type-textpic .ce-bodytext>*+*{margin-block-start:var(--space-md)}
.frame-type-text a,.frame-type-textmedia a,.frame-type-textpic a,.frame-type-uploads a{color:var(--color-brand-ink);text-decoration:underline;text-underline-offset:.16em}
.frame-type-text a:focus-visible,.frame-type-textmedia a:focus-visible,.frame-type-textpic a:focus-visible,.frame-type-uploads a:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}
.frame-type-textmedia .ce-gallery,.frame-type-textpic .ce-gallery,.frame-type-image .ce-gallery{max-width:100%;overflow:hidden}
.frame-type-textmedia .ce-gallery img,.frame-type-textpic .ce-gallery img,.frame-type-image .ce-gallery img{display:block;max-width:100%;height:auto;border-radius:var(--radius-md)}
.frame-type-textmedia .ce-gallery figcaption,.frame-type-textpic .ce-gallery figcaption,.frame-type-image .ce-gallery figcaption{padding-block:var(--space-xs);font-size:var(--text-sm);color:var(--color-text-muted)}
.frame-type-table .ce-table{display:block;max-width:100%;overflow-x:auto;border:1px solid var(--color-border);border-radius:var(--radius-md)}
.frame-type-table table{min-width:32rem;margin:0;background:var(--color-bg)}
.frame-type-table th{background:var(--color-bg-subtle);color:var(--color-text)}
.frame-type-table caption{padding:var(--space-md);text-align:start;font-weight:var(--font-weight-semibold)}
.frame-type-uploads .ce-uploads{list-style:none;padding:0;margin:0;display:grid;gap:var(--space-sm)}
.frame-type-uploads .ce-uploads li{padding:var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg-subtle)}
@media(max-width:63.99rem){.site-header__nav{gap:var(--space-sm)}.site-header .nav__link{padding-inline:.65rem}}
@media(max-width:55.99rem){
  .site-header__inner{min-height:4.25rem;gap:.5rem}
  .site-header__brand{flex-shrink:1;min-width:0}
  .site-header__logotype{font-size:1rem}
  .site-header__logotype{overflow:hidden;text-overflow:ellipsis}
  .site-header__nav{display:none!important}
  .site-header__actions{margin-inline-start:auto}
  .site-header__cta{display:none}
  .nav-toggle{display:inline-flex}
  .site-header__mobile{position:absolute;inset:100% .5rem auto auto;width:min(25rem,calc(100vw - 1rem));max-height:calc(100dvh - 4.75rem);padding:var(--space-lg);border:1px solid var(--color-border);border-block-start:0;border-radius:0 0 var(--radius-md) var(--radius-md);box-shadow:0 24px 40px rgba(17,31,44,.16)}
  .site-header__mobile .nav__link{border-radius:var(--radius-sm)}
  .nav-toggle{width:2.7rem;height:2.7rem;border-radius:999px;background:var(--color-bg-subtle)}
  .nav-toggle:hover,.site-header.is-open .nav-toggle{background:var(--color-bg-muted);border-color:var(--color-border-strong)}
  .hero-section .hero{gap:var(--space-xl)}
  .hero__title{max-width:17ch}
  .hero__media,.hero__art{aspect-ratio:4/3;max-height:none}
  .section-header__title{max-width:24ch}
}
@media(max-width:24rem){.site-header__brand{gap:.45rem}.site-header__logomark{width:2rem;height:2rem}.site-header__logotype{font-size:.84rem}.site-header__actions{gap:.35rem}.language-switch .language-switch__icon{display:none}.language-switch .language-switch__option{min-width:1.85rem}.nav-toggle{width:2.5rem;height:2.5rem}}
@media(prefers-reduced-motion:reduce){.gallery-grid a:hover img{transform:none}.card,.project-card,.person-card,.pricing-card{transition:none}}
/* Editorial premium refinements. */
body{font-family:var(--font-sans);font-weight:430;letter-spacing:-.006em}
h1,h2,h3,h4{font-weight:680;letter-spacing:-.045em}
.section{padding-block:clamp(4rem,9vw,8rem)}
.section:nth-of-type(even){background:linear-gradient(180deg,color-mix(in srgb,var(--color-bg-subtle) 58%,var(--color-bg)) 0%,var(--color-bg) 100%)}
.section-header{margin-block-end:clamp(2rem,4vw,4rem)}
.section-header__kicker,.section__eyebrow,.hero__eyebrow{font-size:.7rem;letter-spacing:.16em}
.section-header__title{font-size:clamp(2.25rem,4vw,4rem);max-width:18ch}
.section-header__lead{max-width:52ch;font-size:clamp(1.05rem,1.5vw,1.25rem);line-height:1.55}
.hero-section .hero{grid-template-columns:minmax(0,1.08fr) minmax(18rem,.92fr);gap:clamp(3rem,7vw,8rem)}
.hero__title{font-size:clamp(3.2rem,7vw,6.8rem);max-width:11ch;line-height:.98;letter-spacing:-.07em}
.hero__lead{font-size:clamp(1.1rem,1.7vw,1.35rem);line-height:1.55}
.hero__media,.hero__art{border-radius:clamp(1rem,2vw,2rem);box-shadow:var(--shadow-lg)}
.hero__media img{filter:saturate(.92) contrast(1.02)}
.card,.project-card,.person-card,.pricing-card,.process__step,.testimonial{border-color:color-mix(in srgb,var(--color-border) 82%,transparent);box-shadow:var(--shadow-sm)}
.card:hover,.project-card:hover,.person-card:hover,.pricing-card:hover{transform:translateY(-3px);border-color:var(--color-brand);box-shadow:var(--shadow)}
.card__body,.project-card__body,.person-card__body{padding:clamp(1.4rem,2.5vw,2.25rem)}
.card__icon{border:1px solid color-mix(in srgb,var(--color-brand) 18%,var(--color-border));background:linear-gradient(145deg,var(--color-bg-muted),var(--color-bg));color:var(--color-brand-ink)}
.btn{min-height:3rem;border-radius:var(--radius-pill);padding-inline:1.25rem;font-weight:650;letter-spacing:-.01em}
.btn--primary{box-shadow:0 8px 20px color-mix(in srgb,var(--color-brand) 23%,transparent)}
.btn--primary:hover{transform:translateY(-1px);box-shadow:0 12px 26px color-mix(in srgb,var(--color-brand) 28%,transparent)}
.btn--ghost{padding-inline:.35rem;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em}
.btn--ghost::after{content:"↗";margin-inline-start:.45rem;text-decoration:none}
.site-header__inner{min-height:5.1rem}
.site-header__logotype{font-weight:700}
.site-header__cta{box-shadow:0 8px 18px color-mix(in srgb,var(--color-brand) 20%,transparent)}
.site-footer{background:var(--color-dark);border-block-start:1px solid color-mix(in srgb,var(--color-dark) 80%,white)}
.site-footer__prelude{background:linear-gradient(120deg,var(--color-brand-ink),var(--color-brand));box-shadow:var(--shadow-lg)}
.cta{border-radius:clamp(1rem,2vw,2rem);box-shadow:var(--shadow)}
.form__input,.form__textarea,.form__select{border-radius:var(--radius-sm);background:color-mix(in srgb,var(--color-bg) 92%,var(--color-bg-subtle));border-color:var(--color-border-strong)}
.form__input:focus,.form__textarea:focus,.form__select:focus{border-color:var(--color-brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--color-focus) 16%,transparent)}
@media(max-width:63.99rem){.hero-section .hero{grid-template-columns:1fr;gap:var(--space-2xl)}.hero__title{max-width:13ch}}
@media(max-width:47.99rem){.section{padding-block:clamp(3.5rem,14vw,5rem)}.section-header__title{font-size:clamp(2rem,9vw,3rem)}.hero__title{font-size:clamp(2.8rem,14vw,4.4rem)}.card:hover,.project-card:hover,.person-card:hover,.pricing-card:hover{transform:none}}

/* Icon-led cards: give the visual anchor room to breathe while preserving
   existing icon IDs, custom uploads, and the compact mobile layout. */
.service-card,.card--feature{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  gap:var(--space-md);
  padding:clamp(1.5rem,3vw,2.5rem);
}
.service-card::before,.card--feature::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:9rem;
  height:9rem;
  inset:auto -3rem -4rem auto;
  border:1px solid color-mix(in srgb,var(--color-brand) 24%,transparent);
  border-radius:50%;
  opacity:.55;
  pointer-events:none;
}
.service-card::after,.card--feature::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:5rem;
  height:5rem;
  inset:-2rem auto auto -2rem;
  border-radius:50%;
  background:color-mix(in srgb,var(--color-brand) 10%,transparent);
  pointer-events:none;
}
.service-card>.card__icon,.card--feature>.card__icon{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:flex-start;
  width:4.5rem;
  height:4.5rem;
  flex:none;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--color-brand) 28%,var(--color-border));
  border-radius:1.25rem;
  background:
    radial-gradient(circle at 25% 15%,color-mix(in srgb,var(--color-brand) 22%,transparent),transparent 58%),
    linear-gradient(145deg,color-mix(in srgb,var(--color-bg-muted) 82%,var(--color-brand)),var(--color-bg));
  color:var(--color-brand-ink);
  box-shadow:0 12px 26px color-mix(in srgb,var(--color-brand) 13%,transparent),inset 0 1px 0 rgba(255,255,255,.55);
}
.service-card>.card__icon::after,.card--feature>.card__icon::after{
  content:"";
  position:absolute;
  inset:.35rem;
  border:1px solid color-mix(in srgb,var(--color-brand) 20%,transparent);
  border-radius:.9rem;
  pointer-events:none;
}
.service-card>.card__icon svg,.card--feature>.card__icon svg{
  position:relative;
  z-index:1;
  width:2.45rem;
  height:2.45rem;
  stroke-width:1.7;
}
.service-card>.card__icon--custom,.card--feature>.card__icon--custom{
  box-sizing:border-box;
  padding:1.1rem;
  object-fit:contain;
}
.service-card .card__title,.card--feature .card__title{margin-block-start:.15rem}
.service-card .card__text,.card--feature .card__text{max-width:38ch}
.service-card:hover>.card__icon,.card--feature:hover>.card__icon{border-color:var(--color-brand);box-shadow:0 16px 30px color-mix(in srgb,var(--color-brand) 20%,transparent),inset 0 1px 0 rgba(255,255,255,.65)}
.resource-list__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:3.25rem;
  height:3.25rem;
  flex:none;
  border:1px solid color-mix(in srgb,var(--color-brand) 22%,var(--color-border));
  border-radius:1rem;
  background:linear-gradient(145deg,color-mix(in srgb,var(--color-bg-muted) 75%,var(--color-brand)),var(--color-bg));
  color:var(--color-brand-ink);
  box-shadow:0 8px 18px color-mix(in srgb,var(--color-brand) 10%,transparent);
}
.resource-list__icon svg{width:1.65rem;height:1.65rem;stroke-width:1.7}
@media(max-width:47.99rem){
  .service-card>.card__icon,.card--feature>.card__icon{width:4rem;height:4rem;border-radius:1.1rem}
  .service-card>.card__icon svg,.card--feature>.card__icon svg{width:2.2rem;height:2.2rem}
  .service-card>.card__icon--custom,.card--feature>.card__icon--custom{padding:.95rem}
}
@media(prefers-reduced-motion:reduce){
  .service-card:hover>.card__icon,.card--feature:hover>.card__icon{box-shadow:0 12px 26px color-mix(in srgb,var(--color-brand) 13%,transparent),inset 0 1px 0 rgba(255,255,255,.55)}
}
