:root{
  --bg:#17171b;
  --fg:#f1eee8;
  --muted:#989a95;
  --line:rgba(241,238,232,.16);
  --line-strong:rgba(241,238,232,.28);
  --surface:rgba(255,255,255,.018);
  --surface-strong:rgba(255,255,255,.035);
  --max:1540px;
  --pad:clamp(22px,4vw,68px);
  --accent:#9f7bff;
  --accent-strong:#b18cff;
  --accent-soft:rgba(159,123,255,.22);
  --accent-line:rgba(159,123,255,.26);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--fg);
  background:
    radial-gradient(circle at 50% -15%, rgba(255,255,255,.038), transparent 36%),
    radial-gradient(circle at 84% 9%, rgba(159,123,255,.14), transparent 27%),
    radial-gradient(circle at 16% 18%, rgba(132,101,227,.08), transparent 26%),
    var(--bg);
  font-family:"Manrope",system-ui,sans-serif;
  font-weight:300;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
::selection{background:#8b6dff;color:#ffffff}

.noise{
  position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.15;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.10) 0 .55px, transparent .7px),
    radial-gradient(circle at 80% 60%, rgba(255,255,255,.07) 0 .45px, transparent .6px);
  background-size:13px 13px,17px 17px;
}

.topbar{
  position:fixed;top:0;left:0;right:0;z-index:40;
  padding:22px var(--pad);
  display:grid;
  grid-template-columns:160px 1fr;
  align-items:center;
  border-bottom:1px solid transparent;
  transition:.3s ease;
}
.topbar.scrolled{
  background:rgba(6,7,8,.78);
  backdrop-filter:blur(18px);
  border-color:var(--line);
}

.brand-anchor{
  display:inline-block;
  font-family:"Bodoni Moda",serif;
  font-style:italic;
  font-weight:600;
  font-size:27px;
  letter-spacing:-.05em;
  line-height:1;
}
body.home-page .brand-anchor{
  display:none;
}

.top-nav{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:clamp(17px,2.2vw,34px);
}
.top-nav a{
  position:relative;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(241,238,232,.68);
  transition:color .25s ease;
}
.top-nav a::after{
  content:"";
  position:absolute;
  left:0;right:100%;bottom:-8px;height:1px;
  background:var(--fg);
  transition:right .25s ease;
}
.top-nav a:hover,
.top-nav a.active{color:var(--fg)}
.top-nav a:hover::after,
.top-nav a.active::after{right:0}

.menu-btn{
  display:none;
  background:none;border:0;color:var(--fg);
  width:38px;height:38px;padding:8px 5px;z-index:45;
}
.menu-btn span{display:block;height:1px;background:var(--fg);margin:7px 0}

main,footer{
  width:min(100%,var(--max));
  margin:auto;
  padding-left:var(--pad);
  padding-right:var(--pad);
}

/* HOME */
.hero{
  min-height:100svh;
  padding-top:132px;
  padding-bottom:70px;
  display:grid;
  align-items:center;
}
.hero-center{
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.hero-title{
  margin:0;
  font-family:"Bodoni Moda",serif;
  font-style:italic;
  font-weight:600;
  font-size:clamp(120px,16vw,255px);
  line-height:.74;
  letter-spacing:-.09em;
  color:var(--accent-strong);
  background:transparent;
  overflow:visible;
  text-shadow:none;
  filter:none;
}
.hero-kicker{
  margin:30px 0 0;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:clamp(10px,.95vw,14px);
  letter-spacing:.20em;
  text-transform:uppercase;
  color:rgba(241,238,232,.74);
}
.hero-intro{
  margin:38px 0 0;
  max-width:600px;
  color:rgba(241,238,232,.54);
  font-size:13px;
  line-height:1.8;
}

.ellipse-stage{
  position:relative;
  width:min(68vw,860px);
  margin:22px auto 0;
  aspect-ratio:1.8 / 1;
}
.ellipse-stage svg{
  width:100%;
  height:100%;
  display:block;
  overflow:visible;
}
.orbit-layer{
  transform-origin:490px 270px;
  animation:layerDrift 12s ease-in-out infinite alternate;
}
.orbit-layer.layer-two{animation-duration:16s;animation-delay:-3s}
.orbit-layer.layer-three{animation-duration:20s;animation-delay:-5s}
.orbit-path{
  fill:none;
  stroke:rgba(241,238,232,.18);
  stroke-width:1.15;
}
.orbit-dot{
  fill:#f1eee8;
  filter:drop-shadow(0 0 6px rgba(255,255,255,.5));
}
.orbit-dot.secondary{opacity:.72}

.hero-floor{
  width:100%;
  margin-top:26px;
  padding-top:18px;
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:130px minmax(0,560px) 1fr;
  gap:26px;
  align-items:start;
}
.hero-floor span{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.18em;
  color:var(--muted);
}
.hero-floor p{
  margin:0;
  color:var(--muted);
  font-size:11px;
  line-height:1.7;
}

.giant-statement{
  border-top:1px solid var(--line-strong);
  padding:110px 0 125px;
  display:grid;
  grid-template-columns:90px 1fr;
  gap:30px;
}
.section-no{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.18em;
  color:var(--muted);
}
.giant-statement h2{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-weight:500;
  font-size:clamp(46px,6.5vw,105px);
  line-height:.97;
  letter-spacing:-.055em;
}

/* PROJECTS OVERVIEW */
.projects{
  padding:46px 0 130px;
}
.projects-head{
  display:grid;
  grid-template-columns:190px minmax(0,760px);
  gap:34px;
  align-items:start;
  margin-bottom:48px;
}
.projects-head h2{
  margin:0 0 16px;
  font-family:"Space Grotesk",sans-serif;
  font-weight:500;
  font-size:clamp(32px,4vw,56px);
  line-height:1.02;
  letter-spacing:-.045em;
}
.projects-head p{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.75;
}

.project{
  display:grid;
  grid-template-columns:72px 240px 1fr 110px;
  gap:28px;
  align-items:start;
  padding:30px 0;
  border-top:1px solid var(--line);
  transition:.3s ease;
}
.project:last-child{border-bottom:1px solid var(--line)}
.project:hover{padding-left:8px}
.project-index{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.16em;
  color:var(--muted);
}
.project-name h3{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-size:31px;
  font-weight:500;
  letter-spacing:-.035em;
}
.project-name p{
  margin:6px 0 0;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:10px;
  color:rgba(241,238,232,.64);
}
.project-desc{
  max-width:650px;
  color:rgba(241,238,232,.58);
  font-size:13px;
  line-height:1.75;
}
.project-meta{
  text-align:right;
}
.project-meta small{
  display:block;
  margin-bottom:5px;
  color:var(--muted);
  font-size:8px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.project-meta span{
  font-size:11px;
  color:rgba(241,238,232,.7);
}

/* INNER PROJECT PAGES */
.inner-hero{
  min-height:auto;
  padding-top:150px;
  padding-bottom:46px;
  border-bottom:1px solid var(--line-strong);
}
.project-heading-row{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:32px;
  align-items:start;
}
.inner-label{
  padding-top:12px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.18em;
  color:var(--muted);
}
.inner-title{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-weight:500;
  font-size:clamp(56px,7.6vw,108px);
  line-height:.9;
  letter-spacing:-.06em;
}
.inner-subtitle{
  margin:18px 0 0;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:13px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:rgba(241,238,232,.68);
}
.inner-intro{
  margin:28px 0 0;
  max-width:720px;
  color:rgba(241,238,232,.58);
  font-size:14px;
  line-height:1.8;
}

.workflow-showcase{
  padding:34px 0 70px;
  border-bottom:1px solid var(--line-strong);
}
.workflow-topline{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:end;
  margin-bottom:20px;
}
.workflow-topline span{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.18em;
  color:var(--muted);
  text-transform:uppercase;
}
.workflow-topline p{
  margin:0;
  color:var(--muted);
  font-size:11px;
}

.workflow-strip{
  display:grid;
  grid-template-columns:repeat(4,minmax(250px,1fr));
  gap:14px;
  overflow-x:auto;
  padding-bottom:12px;
  scroll-snap-type:x mandatory;
}
.workflow-card{
  min-height:360px;
  background:var(--surface);
  border:1px solid var(--line);
  display:grid;
  grid-template-rows:1fr auto;
  scroll-snap-align:start;
}
.workflow-visual{
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    linear-gradient(135deg,rgba(255,255,255,.035),transparent 52%),
    rgba(255,255,255,.01);
}
.workflow-visual::before,
.workflow-visual::after{
  content:"";
  position:absolute;
  border:1px solid rgba(241,238,232,.13);
}
.workflow-visual::before{
  width:62%;height:54%;
  left:12%;top:14%;
}
.workflow-visual::after{
  width:50%;height:42%;
  right:10%;bottom:12%;
}
.workflow-number{
  position:relative;
  z-index:2;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:54px;
  font-weight:500;
  color:rgba(241,238,232,.82);
  letter-spacing:-.05em;
}
.workflow-caption{
  border-top:1px solid var(--line);
  padding:16px 16px 18px;
}
.workflow-caption small{
  display:block;
  margin-bottom:6px;
  color:var(--muted);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:8px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.workflow-caption strong{
  display:block;
  margin-bottom:6px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:13px;
  font-weight:500;
}
.workflow-caption p{
  margin:0;
  color:rgba(241,238,232,.55);
  font-size:11px;
  line-height:1.6;
}
.workflow-image-note{
  margin-top:12px;
  color:var(--muted);
  font-size:10px;
  line-height:1.5;
}

.project-overview{
  padding:48px 0 68px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-bottom:1px solid var(--line-strong);
}
.project-overview div{
  padding:0 24px;
  border-left:1px solid var(--line);
}
.project-overview div:first-child{
  padding-left:0;
  border-left:0;
}
.project-overview small{
  display:block;
  margin-bottom:10px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:8px;
  letter-spacing:.16em;
  color:var(--muted);
  text-transform:uppercase;
}
.project-overview strong{
  font-size:13px;
  font-weight:400;
  line-height:1.6;
}

.detail-section{
  padding:84px 0;
  display:grid;
  grid-template-columns:190px minmax(0,820px);
  gap:40px;
  border-bottom:1px solid var(--line);
}
.detail-aside{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.17em;
  color:var(--muted);
  text-transform:uppercase;
}
.detail-copy h2{
  margin:0 0 28px;
  font-family:"Space Grotesk",sans-serif;
  font-weight:500;
  font-size:clamp(30px,3.5vw,50px);
  line-height:1.05;
  letter-spacing:-.045em;
}
.detail-copy p{
  margin:0 0 18px;
  color:rgba(241,238,232,.6);
  font-size:14px;
  line-height:1.82;
}
.detail-list{
  margin:34px 0 0;
  padding:0;
  list-style:none;
}
.detail-list li{
  display:grid;
  grid-template-columns:40px 1fr;
  gap:16px;
  padding:16px 0;
  border-top:1px solid var(--line);
  font-size:13px;
  color:rgba(241,238,232,.72);
}
.detail-list li:last-child{border-bottom:1px solid var(--line)}
.detail-list b{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  font-weight:400;
  color:var(--muted);
}

/* ABOUT */
.section-block{
  border-top:1px solid var(--line-strong);
  padding:100px 0 115px;
  display:grid;
  grid-template-columns:90px 1fr;
  gap:30px;
}
.section-block h2{
  margin:0 0 28px;
  font-family:"Space Grotesk",sans-serif;
  font-weight:500;
  font-size:clamp(42px,5.5vw,82px);
  line-height:.98;
  letter-spacing:-.055em;
}
.section-block p{
  max-width:760px;
  margin:0;
  color:rgba(241,238,232,.58);
  font-size:14px;
  line-height:1.85;
}

footer{
  border-top:1px solid var(--line);
  padding-top:28px;
  padding-bottom:38px;
  display:flex;
  justify-content:space-between;
  align-items:end;
}
footer div{display:flex;flex-direction:column}
footer strong{
  font-family:"Bodoni Moda",serif;
  font-style:italic;
  font-size:30px;
  letter-spacing:-.05em;
}
footer small, footer span{
  color:var(--muted);
  font-size:9px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
footer i{font-style:normal}

@keyframes layerDrift{
  from{transform:none}
  to{transform:rotate(3deg) translateY(-6px)}
}

@media(max-width:980px){
  .project{
    grid-template-columns:60px 200px 1fr;
  }
  .project-meta{
    grid-column:3;
    text-align:left;
  }
  .project-overview{
    grid-template-columns:repeat(2,1fr);
    gap:30px 0;
  }
  .project-overview div:nth-child(3){
    border-left:0;
    padding-left:0;
  }
  .workflow-strip{
    grid-template-columns:repeat(4,minmax(280px,75vw));
  }
}

@media(max-width:820px){
  .topbar{grid-template-columns:1fr auto}
  .menu-btn{display:block}
  .top-nav{
    position:fixed;
    inset:0;
    z-index:35;
    background:rgba(6,7,8,.97);
    backdrop-filter:blur(20px);
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    padding:100px var(--pad) 60px;
    gap:24px;
    opacity:0;
    pointer-events:none;
    transition:.25s ease;
  }
  .top-nav.open{opacity:1;pointer-events:auto}
  .top-nav a{
    font-size:23px;
    letter-spacing:-.02em;
    text-transform:none;
  }
  .hero-floor{
    grid-template-columns:1fr;
    gap:10px;
  }
  .giant-statement,.section-block{
    grid-template-columns:1fr;
    gap:18px;
  }
  .projects-head{
    grid-template-columns:1fr;
    gap:18px;
  }
  .project-heading-row{
    grid-template-columns:1fr;
  }
  .inner-label{display:none}
  .detail-section{
    grid-template-columns:1fr;
    gap:22px;
  }
}

@media(max-width:600px){
  :root{--pad:20px}
  .hero-title{font-size:clamp(90px,29vw,150px)}
  .ellipse-stage{width:94vw}
  .hero-kicker{font-size:11px;letter-spacing:.15em}
  .giant-statement h2{font-size:clamp(38px,12vw,56px)}
  .project{
    grid-template-columns:1fr;
    gap:12px;
  }
  .project-index{display:none}
  .project-meta{text-align:left}
  .inner-title{font-size:clamp(62px,20vw,110px)}
  .project-overview{grid-template-columns:1fr}
  .project-overview div,
  .project-overview div:nth-child(3){
    border-left:0;
    padding:18px 0;
    border-top:1px solid var(--line);
  }
}

/* HOME HEADER: no logo, navigation anchored cleanly to the right */
.home-header{
  grid-template-columns:1fr auto;
}
.home-header .top-nav{
  grid-column:2;
  justify-self:end;
  max-width:calc(100vw - (2 * var(--pad)));
}
@media(max-width:820px){
  .home-header .top-nav{max-width:none;}
}


/* Fast flicker switches sharply without transition smoothing */
/* Continuous Lichtgestalt bloom — smooth and increasingly overexposed */
/*
  Many tightly-spaced keyframes create a smooth visual ramp instead of
  a few obvious glow "steps". The final state intentionally overexposes
  the word so its letter shapes begin to dissolve into the light.
*/



/* ---------------------------------------------------------
   AEGIS / PROJECTS — live detection micro-story
   Built as a reusable animation surface for future sequences.
--------------------------------------------------------- */

.project-demo-cell{
  max-width:none;
  min-width:0;
}

.aegis-inline-demo{
  width:100%;
  min-width:0;
  pointer-events:none;
}

.demo-shell{
  width:100%;
  min-height:138px;
  padding:12px 14px 11px;
  border:1px solid rgba(241,238,232,.13);
  background:
    radial-gradient(circle at 18% 50%, rgba(255,255,255,.025), transparent 35%),
    rgba(255,255,255,.012);
  overflow:hidden;
}

.demo-head,
.demo-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:7.5px;
  line-height:1;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(241,238,232,.38);
}

.demo-head-status{
  color:rgba(241,238,232,.23);
}

.demo-stage{
  position:relative;
  min-height:78px;
  display:flex;
  align-items:center;
  overflow:hidden;
}

.demo-text-window{
  position:relative;
  width:100%;
  min-height:36px;
  display:flex;
  align-items:center;
  overflow:hidden;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size:clamp(14px,1.18vw,18px);
  letter-spacing:-.025em;
  color:rgba(241,238,232,.92);
  white-space:nowrap;
}

.demo-source{
  position:relative;
  z-index:1;
}

.demo-caret{
  position:relative;
  z-index:1;
  display:inline-block;
  width:1px;
  height:1.15em;
  margin-left:3px;
  background:rgba(241,238,232,.88);
  animation:demoCaretBlink .76s steps(1,end) infinite;
}

.demo-caret.is-hidden{
  opacity:0;
  animation:none;
}

.demo-detected-wipe{
  position:absolute;
  z-index:2;
  left:0;
  top:0;
  bottom:0;
  width:0;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:#08090a;
}

.demo-detected{
  flex:none;
  display:inline-block;
  color:#ff4d55;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size:clamp(14px,1.18vw,18px);
  font-weight:800;
  letter-spacing:-.035em;
  text-shadow:0 0 13px rgba(255,77,85,.16);
}

.demo-detected-wipe.is-scanning{
  will-change:width;
}

.demo-scanner{
  position:absolute;
  z-index:5;
  left:-23px;
  top:50%;
  width:58px;
  height:58px;
  transform:translate3d(0,-50%,0) rotate(-8deg);
  opacity:0;
  filter:drop-shadow(0 0 12px rgba(255,255,255,.13));
  will-change:transform,opacity;
}

.demo-scanner svg{
  position:relative;
  z-index:4;
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}

.demo-scanner svg circle,
.demo-scanner svg path{
  fill:rgba(8,9,10,.78);
  stroke:rgba(244,242,237,.92);
  stroke-width:2;
  stroke-linecap:round;
}

.demo-scanner svg .lens-glint{
  fill:#fff;
  stroke:none;
  opacity:.82;
  filter:drop-shadow(0 0 6px rgba(255,255,255,.7));
}

.demo-scanner.is-scanning{
  opacity:1;
}

.demo-trail{
  position:absolute;
  z-index:1;
  right:30px;
  top:50%;
  width:150px;
  height:28px;
  transform:translateY(-50%);
  background:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(255,255,255,.015) 15%,
      rgba(255,255,255,.08) 62%,
      rgba(255,255,255,.27) 100%
    );
  filter:blur(5px);
  opacity:.95;
  clip-path:polygon(0 38%,100% 0,100% 100%,0 62%);
}

.demo-trail::after{
  content:"";
  position:absolute;
  left:16%;
  right:0;
  top:50%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.58));
  box-shadow:
    -20px -7px 0 rgba(255,255,255,.16),
    17px 8px 0 rgba(255,255,255,.24),
    45px -10px 0 rgba(255,255,255,.18);
}

.demo-spark{
  position:absolute;
  z-index:3;
  width:3px;
  height:3px;
  border-radius:50%;
  background:#fff;
  opacity:0;
  box-shadow:0 0 8px rgba(255,255,255,.75);
}

.demo-scanner.is-scanning .demo-spark{
  animation:demoSpark .48s ease-out infinite;
}

.spark-one{left:-28px;top:17px;animation-delay:.03s!important}
.spark-two{left:-62px;top:34px;animation-delay:.18s!important}
.spark-three{left:-95px;top:25px;animation-delay:.31s!important}

.demo-foot{
  padding-top:8px;
  border-top:1px solid rgba(241,238,232,.08);
}

.demo-foot span:first-child{
  transition:color .2s ease;
}

.aegis-inline-demo[data-state="typing"] .demo-foot span:first-child{
  color:rgba(241,238,232,.62);
}

.aegis-inline-demo[data-state="scanning"] .demo-foot span:first-child{
  color:rgba(255,255,255,.82);
}

.aegis-inline-demo[data-state="detected"] .demo-foot span:first-child{
  color:#ff4d55;
}

@keyframes demoCaretBlink{
  0%,47%{opacity:1}
  48%,100%{opacity:0}
}

@keyframes demoSpark{
  0%{opacity:0;transform:translate3d(8px,0,0) scale(.4)}
  25%{opacity:.9}
  100%{opacity:0;transform:translate3d(-22px,-8px,0) scale(1.15)}
}

@media(max-width:980px){
  .project-demo-cell{
    grid-column:3;
  }
}

@media(max-width:600px){
  .project-demo-cell{
    grid-column:1/-1;
  }
  .demo-shell{
    min-height:132px;
  }
  .demo-text-window,
  .demo-detected{
    font-size:14px;
  }
}


/* Aegis demo entity styles */
.demo-detected{
  padding:3px 7px 4px;
  border-radius:2px;
}

.aegis-inline-demo[data-entity="person"] .demo-detected{
  color:#ff4d55;
  background:rgba(255,77,85,.16);
  box-shadow:
    inset 0 0 0 1px rgba(255,77,85,.18),
    0 0 18px rgba(255,77,85,.08);
  text-shadow:0 0 13px rgba(255,77,85,.18);
}

.aegis-inline-demo[data-entity="location"] .demo-detected{
  color:#5f86ff;
  background:rgba(58,91,170,.22);
  box-shadow:
    inset 0 0 0 1px rgba(95,134,255,.20),
    0 0 18px rgba(70,105,205,.10);
  text-shadow:0 0 13px rgba(70,105,205,.20);
}

.aegis-inline-demo[data-entity="person"][data-state="detected"] .demo-foot span:first-child{
  color:#ff7077;
}

.aegis-inline-demo[data-entity="location"][data-state="detected"] .demo-foot span:first-child{
  color:#6f93ff;
}

/* Scanner travel is now calculated from the actual typed text width in JS. */
.demo-scanner{
  left:0;
}

/* Keep the magic trail visually behind the lens and local to its path. */
.demo-trail{
  width:118px;
  right:34px;
  opacity:.9;
}


/* v14: clean Noirin glyph rendering and slightly smaller subtitle */
.hero-title{isolation:isolate;}
/* v14: sentence-aware selective Aegis replacement */
.demo-head{display:none !important;}
.demo-shell{min-height:126px;padding-top:11px;}
.demo-stage{min-height:88px;}
.demo-text-window{overflow:visible;}
.demo-prefix,.demo-entity-source,.demo-suffix{white-space:pre;}
.demo-entity-slot{position:relative;display:inline-block;white-space:nowrap;}
.demo-entity-source{position:relative;z-index:1;}
.demo-detected{
  position:absolute;z-index:3;left:0;top:50%;transform:translateY(-50%);
  width:max-content;opacity:0;clip-path:inset(0 100% 0 0);transition:none;
  padding:3px 7px 4px;border-radius:2px;
}
.demo-detected.is-visible{opacity:1;}
.demo-foot{justify-content:flex-start;}
.aegis-inline-demo[data-entity="person"] .demo-detected{
  color:#ff555d;background:rgba(255,88,96,.19);
  box-shadow:inset 0 0 0 1px rgba(255,100,108,.26),0 0 18px rgba(255,72,82,.10);
  font-weight:800;
}
.aegis-inline-demo[data-entity="location"] .demo-detected{
  color:#78a0ff;background:rgba(33,68,145,.42);
  box-shadow:inset 0 0 0 1px rgba(105,145,255,.30),0 0 18px rgba(55,92,185,.14);
  font-weight:800;
}
.aegis-inline-demo[data-entity="blacklist"] .demo-detected{
  color:#fff;background:#000;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.26),0 0 16px rgba(255,255,255,.06);
  font-weight:700;text-shadow:none;
}
.aegis-inline-demo[data-entity="person"][data-state="detected"] .demo-foot span{color:#ff737a;}
.aegis-inline-demo[data-entity="location"][data-state="detected"] .demo-foot span{color:#82a5ff;}
.aegis-inline-demo[data-entity="blacklist"][data-state="detected"] .demo-foot span{color:rgba(255,255,255,.82);}




/* Slightly smaller subtitle */
.hero-kicker{
  font-size:clamp(10px,.92vw,13px);
}

/* Demo bottom live status */
.demo-foot{
  justify-content:flex-start;
  font-size:9px;
}
.demo-foot span{
  letter-spacing:.16em;
}

/* Sentence-aware replacement */
.demo-head{
  display:none !important;
}
.demo-stage{
  min-height:88px;
}
.demo-text-window{
  overflow:visible;
}
.demo-prefix,
.demo-entity-source,
.demo-suffix{
  white-space:pre;
}
.demo-entity-slot{
  position:relative;
  display:inline-block;
  white-space:nowrap;
  vertical-align:baseline;
}
.demo-entity-source{
  position:relative;
  display:inline-block;
  z-index:1;
  white-space:pre;
  will-change:clip-path,opacity;
}
.demo-detected{
  position:absolute;
  display:inline-block;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:max-content;
  white-space:pre;
  opacity:0;
  clip-path:inset(0 100% 0 0);
  transition:none;
  will-change:clip-path,opacity;
}
.demo-detected.is-visible{
  opacity:1;
}

/* Placeholder-only background size */
.aegis-inline-demo[data-entity="person"] .demo-detected{
  color:#ff555d;
  background:rgba(255,88,96,.19);
  box-shadow:
    inset 0 0 0 1px rgba(255,100,108,.26),
    0 0 18px rgba(255,72,82,.10);
  font-weight:800;
  padding:3px 7px 4px;
  border-radius:2px;
}
.aegis-inline-demo[data-entity="location"] .demo-detected{
  color:#78a0ff;
  background:rgba(33,68,145,.42);
  box-shadow:
    inset 0 0 0 1px rgba(105,145,255,.30),
    0 0 18px rgba(55,92,185,.14);
  font-weight:800;
  padding:3px 7px 4px;
  border-radius:2px;
}
.aegis-inline-demo[data-entity="blacklist"] .demo-detected{
  color:#fff;
  background:#000;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.24),
    0 0 16px rgba(255,255,255,.05);
  font-weight:700;
  text-shadow:none;
  padding:3px 7px 4px;
  border-radius:2px;
}

.aegis-inline-demo[data-state="typing"] .demo-foot span{
  color:rgba(241,238,232,.72);
}
.aegis-inline-demo[data-state="scanning"] .demo-foot span{
  color:rgba(255,255,255,.9);
}
.aegis-inline-demo[data-entity="person"][data-state="detected"] .demo-foot span{
  color:#ff737a;
}
.aegis-inline-demo[data-entity="location"][data-state="detected"] .demo-foot span{
  color:#82a5ff;
}
.aegis-inline-demo[data-entity="blacklist"][data-state="detected"] .demo-foot span{
  color:rgba(255,255,255,.86);
}


/* ---------------------------------------------------------
   NOIRIN TITLE v19
   Normal state = one untouched text node.
   No permanent per-letter spans, no dark layers, no masks.
--------------------------------------------------------- */

.hero-title.is-letter-effect{
  white-space:nowrap;
}

/* Only exists for the few milliseconds of a letter effect. */
.hero-title.is-letter-effect .effect-letter{
  display:inline;
  color:inherit;
  background:none;
  text-shadow:none;
  filter:none;
}

.hero-title.is-letter-effect .effect-letter.is-off{
  visibility:hidden;
}

/*
  Glow acts on the normal, unsplit word.
  No CSS filter/blur is used, so the font itself stays intact.
*/
.hero-title.glow-bloom{
  animation:noirinGlowV19 var(--glow-duration,3800ms) linear forwards;
}

@keyframes noirinGlowV19{
  0%{
    color:rgb(241,238,232);
    text-shadow:0 0 0 rgba(255,255,255,0);
  }
  12%{
    color:rgb(244,242,237);
    text-shadow:
      0 0 5px rgba(255,255,255,.05),
      0 0 14px rgba(255,255,255,.025);
  }
  25%{
    color:rgb(247,245,242);
    text-shadow:
      0 0 9px rgba(255,255,255,.11),
      0 0 24px rgba(255,255,255,.06);
  }
  40%{
    color:rgb(250,249,246);
    text-shadow:
      0 0 14px rgba(255,255,255,.22),
      0 0 36px rgba(255,255,255,.13),
      0 0 62px rgba(255,255,255,.06);
  }
  55%{
    color:rgb(253,252,250);
    text-shadow:
      0 0 19px rgba(255,255,255,.36),
      0 0 50px rgba(255,255,255,.23),
      0 0 88px rgba(255,255,255,.13),
      0 0 138px rgba(255,255,255,.06);
  }
  70%{
    color:#fff;
    text-shadow:
      0 0 25px rgba(255,255,255,.55),
      0 0 66px rgba(255,255,255,.38),
      0 0 115px rgba(255,255,255,.23),
      0 0 178px rgba(255,255,255,.12);
  }
  84%{
    color:#fff;
    text-shadow:
      0 0 35px rgba(255,255,255,.78),
      0 0 92px rgba(255,255,255,.56),
      0 0 158px rgba(255,255,255,.36),
      0 0 244px rgba(255,255,255,.21),
      0 0 360px rgba(255,255,255,.10);
  }
  100%{
    color:#fff;
    text-shadow:
      0 0 48px rgba(255,255,255,1),
      0 0 122px rgba(255,255,255,.84),
      0 0 202px rgba(255,255,255,.62),
      0 0 310px rgba(255,255,255,.38),
      0 0 470px rgba(255,255,255,.21),
      0 0 650px rgba(255,255,255,.11);
  }
}


/* --- v20 project demo spacing refinements --- */
.project-demo-cell{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.project-demo-summary{
  max-width:720px;
}

.project-demo-lead{
  margin:0 0 12px;
  color:rgba(241,238,232,.68);
  font-size:12px;
  line-height:1.75;
}

.project-demo-points{
  margin:0;
  padding-left:18px;
  color:rgba(241,238,232,.56);
  font-size:11px;
  line-height:1.7;
}

.project-demo-points li + li{
  margin-top:8px;
}

.project-demo-points b{
  color:rgba(241,238,232,.86);
  font-weight:700;
}


/* --- v21 theme override --- */
.hero-kicker{
  color:rgba(241,238,232,.68);
}
.hero-intro,
.project-desc,
.project-demo-lead,
.project-demo-points{
  color:rgba(241,238,232,.58);
}


/* --- v22 accent & project refinements --- */
.brand-anchor{
  color:var(--accent-strong);
}

.topbar{
  backdrop-filter:blur(14px);
}

.top-nav a{
  color:rgba(241,238,232,.76);
}
.top-nav a::after{
  background:var(--accent-strong);
}
.top-nav a:hover,
.top-nav a.active{
  color:var(--accent-strong);
}

.section-no,
.hero-floor span,
.project-index,
.project-meta small{
  color:var(--accent-strong);
}

.section-word{
  letter-spacing:.14em;
}

.orbit-path{
  stroke:rgba(168,136,255,.28);
}
.orbit-dot{
  fill:#f3ecff;
  filter:drop-shadow(0 0 9px rgba(170,132,255,.68));
}

.giant-statement,
.inner-hero,
.project:last-child{
  border-color:rgba(159,123,255,.20);
}

.projects-head p,
.hero-floor p{
  color:rgba(241,238,232,.62);
}

.project{
  border-top:1px solid rgba(159,123,255,.18);
}
.project:hover{
  padding-left:8px;
}
.project-name h3{
  color:#f4f0ff;
}
.project-name p{
  margin:7px 0 0;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  text-transform:none;
  letter-spacing:.08em;
  font-size:12px;
  line-height:1.45;
  color:rgba(233,223,255,.92);
  max-width:240px;
}

.project-index.project-icon-wrap{
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  padding-top:2px;
}
.project-icon{
  width:26px;
  height:26px;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 0 10px rgba(168,136,255,.35));
}

.demo-shell{
  border:1px solid rgba(159,123,255,.18);
  background:
    radial-gradient(circle at 18% 50%, rgba(159,123,255,.06), transparent 38%),
    rgba(255,255,255,.012);
}

.project-demo-summary{
  border-top:1px solid rgba(159,123,255,.14);
  padding-top:16px;
}

.project-demo-lead{
  color:rgba(241,238,232,.70);
}
.project-demo-points{
  color:rgba(241,238,232,.60);
}
.project-demo-points b{
  color:#efe5ff;
}

.aegis-inline-demo[data-entity="person"] .demo-detected{
  color:#ff6670;
  background:rgba(255,102,112,.18);
  box-shadow:
    inset 0 0 0 1px rgba(255,118,127,.28),
    0 0 18px rgba(255,84,96,.12);
}
.aegis-inline-demo[data-entity="location"] .demo-detected{
  color:#8eacff;
  background:rgba(62,88,164,.42);
  box-shadow:
    inset 0 0 0 1px rgba(130,164,255,.30),
    0 0 18px rgba(81,112,204,.15);
}

/* Stronger, more visible Noirin bloom with a violet core */
.hero-title.glow-bloom{
  animation:noirinGlowV22 var(--glow-duration,3800ms) linear forwards !important;
}

@keyframes noirinGlowV22{
  0%{
    color:var(--accent-strong);
    text-shadow:0 0 0 rgba(0,0,0,0);
  }
  18%{
    color:#b998ff;
    text-shadow:
      0 0 8px rgba(177,140,255,.16),
      0 0 18px rgba(177,140,255,.08);
  }
  36%{
    color:#cfb8ff;
    text-shadow:
      0 0 15px rgba(177,140,255,.34),
      0 0 34px rgba(177,140,255,.17),
      0 0 64px rgba(177,140,255,.08);
  }
  58%{
    color:#e5daff;
    text-shadow:
      0 0 24px rgba(191,158,255,.55),
      0 0 56px rgba(191,158,255,.30),
      0 0 102px rgba(191,158,255,.15),
      0 0 150px rgba(255,255,255,.07);
  }
  78%{
    color:#fff;
    text-shadow:
      0 0 38px rgba(210,183,255,.92),
      0 0 86px rgba(210,183,255,.52),
      0 0 152px rgba(210,183,255,.28),
      0 0 250px rgba(255,255,255,.16);
  }
  100%{
    color:#fff;
    text-shadow:
      0 0 56px rgba(226,208,255,1),
      0 0 128px rgba(226,208,255,.74),
      0 0 224px rgba(226,208,255,.42),
      0 0 340px rgba(255,255,255,.24),
      0 0 520px rgba(255,255,255,.10);
  }
}


/* --- v23 navigation / legal / projects refinements --- */

/* Projects nav dropdown */
.top-nav{
  position:relative;
}
.nav-dropdown{
  position:relative;
  display:flex;
  align-items:center;
}
.nav-dropdown > a{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.nav-dropdown > a::before{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:-8px;
  height:1px;
  background:var(--accent-strong);
  transition:right .25s ease;
}
.nav-dropdown:hover > a,
.nav-dropdown:focus-within > a{
  color:var(--accent-strong);
}
.nav-dropdown:hover > a::before,
.nav-dropdown:focus-within > a::before,
.nav-dropdown > a.active::before{
  right:0;
}
.nav-dropdown-menu{
  position:absolute;
  top:calc(100% + 14px);
  left:0;
  min-width:190px;
  display:flex;
  flex-direction:column;
  gap:0;
  padding:10px 0;
  border:1px solid rgba(159,123,255,.18);
  background:rgba(25,25,29,.96);
  backdrop-filter:blur(14px);
  box-shadow:0 18px 40px rgba(0,0,0,.28);
  opacity:0;
  transform:translateY(8px);
  pointer-events:none;
  transition:opacity .24s ease, transform .24s ease;
  z-index:60;
}
.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.nav-dropdown-menu a{
  padding:10px 16px;
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(241,238,232,.76);
}
.nav-dropdown-menu a:hover,
.nav-dropdown-menu a.active{
  color:var(--accent-strong);
  background:rgba(159,123,255,.09);
}
.nav-dropdown-menu a::after{
  display:none !important;
}

/* Projects section title cleanup */
.projects-head{
  grid-template-columns:260px minmax(0,760px);
  gap:34px;
}
.projects-title{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-weight:500;
  font-size:clamp(48px,6.2vw,96px);
  line-height:.95;
  letter-spacing:-.06em;
  color:#f4f0ff;
}

/* Bigger icon */
.project{
  grid-template-columns:118px 240px 1fr 110px;
}
.project-icon{
  width:78px;
  height:78px;
}
.project-index.project-icon-wrap{
  padding-top:0;
}

/* Footer / legal */
.site-footer{
  margin-top:40px;
  padding-top:34px;
  padding-bottom:40px;
  border-top:1px solid rgba(159,123,255,.18);
  display:grid;
  grid-template-columns:1.3fr .8fr .8fr .95fr;
  gap:28px 34px;
  align-items:start;
}
.footer-legal{grid-column:4;}
.footer-brand strong{
  display:block;
  font-family:"Bodoni Moda",serif;
  font-style:italic;
  font-weight:600;
  font-size:30px;
  line-height:1;
  color:var(--accent-strong);
}
.footer-brand small{
  display:block;
  margin-top:6px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(241,238,232,.56);
}
.footer-brand p{
  margin:14px 0 0;
  max-width:320px;
  font-size:12px;
  line-height:1.75;
  color:rgba(241,238,232,.56);
}
.footer-col{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.footer-col span{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent-strong);
}
.footer-col a{
  font-size:12px;
  color:rgba(241,238,232,.66);
}
.footer-col a:hover{
  color:var(--accent-strong);
}
.footer-meta{
  grid-column:1 / -1;
  padding-top:8px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  border-top:1px solid rgba(159,123,255,.12);
}
.footer-meta small,
.footer-meta span{
  font-size:11px;
  line-height:1.6;
  color:rgba(241,238,232,.48);
}

.legal-block h2{
  margin:0 0 12px;
  font-family:"Space Grotesk",sans-serif;
  font-weight:500;
  font-size:26px;
  letter-spacing:-.04em;
  color:#f4f0ff;
}
.legal-block h2:not(:first-child){
  margin-top:30px;
}
.legal-block p{
  margin:0;
  max-width:760px;
  font-size:13px;
  line-height:1.8;
  color:rgba(241,238,232,.62);
}

/* Stronger end-state glow that overpowers the title */
.hero-title.glow-bloom{
  animation:noirinGlowV23 var(--glow-duration,3800ms) linear forwards !important;
}

@keyframes noirinGlowV23{
  0%{
    color:var(--accent-strong);
    text-shadow:0 0 0 rgba(0,0,0,0);
  }
  18%{
    color:#baa0ff;
    text-shadow:
      0 0 8px rgba(177,140,255,.20),
      0 0 18px rgba(177,140,255,.10);
  }
  36%{
    color:#d6c1ff;
    text-shadow:
      0 0 16px rgba(195,162,255,.40),
      0 0 38px rgba(195,162,255,.22),
      0 0 70px rgba(195,162,255,.10);
  }
  58%{
    color:#f0e8ff;
    text-shadow:
      0 0 28px rgba(214,192,255,.76),
      0 0 66px rgba(214,192,255,.40),
      0 0 118px rgba(214,192,255,.20),
      0 0 200px rgba(255,255,255,.10);
  }
  78%{
    color:rgba(255,255,255,.98);
    text-shadow:
      0 0 48px rgba(234,220,255,1),
      0 0 104px rgba(234,220,255,.66),
      0 0 180px rgba(234,220,255,.34),
      0 0 280px rgba(255,255,255,.18);
  }
  100%{
    color:rgba(255,255,255,.92);
    text-shadow:
      0 0 76px rgba(247,240,255,1),
      0 0 160px rgba(247,240,255,.94),
      0 0 260px rgba(247,240,255,.64),
      0 0 380px rgba(255,255,255,.34),
      0 0 560px rgba(255,255,255,.18);
  }
}

@media (max-width: 900px){
  .projects-head{
    grid-template-columns:1fr;
  }
  .project{
    grid-template-columns:84px 1fr;
  }
  .project-desc,
  .project-meta{
    grid-column:1 / -1;
  }
  .project-icon{
    width:58px;
    height:58px;
  }
  .site-footer{
    grid-template-columns:1fr 1fr;
  }
  .footer-legal{
    grid-column:2;
  }
  .footer-meta{
    flex-direction:column;
    align-items:flex-start;
  }
  .nav-dropdown-menu{
    min-width:160px;
  }
}


/* --- v24 argus demo --- */
.argus-inline-demo{
  width:100%;
  min-width:0;
  pointer-events:none;
}

.argus-demo-shell{
  width:100%;
  border:1px solid rgba(159,123,255,.18);
  background:
    radial-gradient(circle at 18% 50%, rgba(159,123,255,.06), transparent 38%),
    rgba(255,255,255,.012);
  padding:12px 14px 14px;
}

.argus-window{
  width:100%;
  border:1px solid rgba(241,238,232,.10);
  background:rgba(18,18,23,.98);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.argus-window-bar{
  display:flex;
  align-items:center;
  gap:8px;
  height:32px;
  padding:0 12px;
  border-bottom:1px solid rgba(241,238,232,.08);
  background:rgba(255,255,255,.03);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
}

.argus-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  display:inline-block;
}
.argus-dot.red{background:#ff6167}
.argus-dot.yellow{background:#ffbe55}
.argus-dot.green{background:#2bd576}

.argus-window-title{
  margin-left:6px;
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(241,238,232,.48);
}

.argus-window-body{
  display:grid;
  grid-template-columns:44px 1fr;
  min-height:186px;
}

.argus-sidebar{
  border-right:1px solid rgba(241,238,232,.06);
  background:rgba(255,255,255,.02);
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:14px 12px;
}
.argus-sidebar span{
  display:block;
  width:18px;
  height:18px;
  border-radius:6px;
  background:rgba(159,123,255,.16);
  box-shadow:inset 0 0 0 1px rgba(159,123,255,.18);
}

.argus-desktop{
  position:relative;
  overflow:hidden;
  min-height:186px;
  background:
    radial-gradient(circle at 70% 28%, rgba(159,123,255,.16), transparent 26%),
    radial-gradient(circle at 22% 78%, rgba(90,70,170,.20), transparent 30%),
    linear-gradient(135deg, #191821 0%, #16161c 100%);
}

.argus-toolbar{
  position:absolute;
  top:12px;
  left:12px;
  display:flex;
  gap:8px;
}
.argus-toolbar-chip{
  display:inline-flex;
  align-items:center;
  height:22px;
  padding:0 10px;
  border:1px solid rgba(241,238,232,.08);
  background:rgba(255,255,255,.04);
  border-radius:999px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(241,238,232,.62);
}

.argus-app-card{
  position:absolute;
  border:1px solid rgba(241,238,232,.08);
  background:rgba(255,255,255,.045);
  box-shadow:0 10px 22px rgba(0,0,0,.14);
}
.argus-app-card.mail{
  top:48px;
  left:36px;
  width:220px;
  height:92px;
}
.argus-app-card.mail::before,
.argus-app-card.mail::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  height:8px;
  background:rgba(241,238,232,.11);
}
.argus-app-card.mail::before{top:16px}
.argus-app-card.mail::after{top:34px}

.argus-app-card.small{
  width:82px;
  height:52px;
}
.argus-app-card.small.top{
  top:40px;
  right:26px;
}
.argus-app-card.small.right{
  bottom:22px;
  right:44px;
}

.argus-selection{
  position:absolute;
  left:92px;
  top:72px;
  width:0;
  height:0;
  border:2px solid #ff5b65;
  background:rgba(255,91,101,.08);
  box-shadow:
    0 0 0 1px rgba(255,91,101,.18),
    0 0 20px rgba(255,91,101,.14);
  opacity:0;
}

.argus-capture{
  position:absolute;
  left:92px;
  top:72px;
  width:144px;
  height:78px;
  border:1px solid rgba(255,255,255,.12);
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
    linear-gradient(135deg, rgba(159,123,255,.18), rgba(255,255,255,.02));
  box-shadow:0 8px 20px rgba(0,0,0,.18);
  opacity:0;
  transform:translate3d(0,0,0) scale(.92);
}
.argus-capture::before,
.argus-capture::after{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  height:6px;
  background:rgba(241,238,232,.18);
}
.argus-capture::before{top:14px}
.argus-capture::after{top:28px}

.argus-plane{
  position:absolute;
  left:0;
  top:0;
  width:54px;
  height:54px;
  opacity:0;
  transform:translate3d(-80px,140px,0) rotate(-8deg);
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.18));
}
.argus-plane svg{
  width:100%;
  height:100%;
  display:block;
}
.argus-plane path:first-child{
  fill:#efe7ff;
}
.argus-plane .plane-line{
  fill:none;
  stroke:rgba(71,48,143,.55);
  stroke-width:3;
  stroke-linecap:round;
}

.argus-explanation{
  margin-top:14px;
  min-height:58px;
  padding:12px 12px 10px;
  border-top:1px solid rgba(159,123,255,.14);
  opacity:.14;
  transform:translateY(4px);
}
.argus-explanation small{
  display:block;
  margin-bottom:8px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--accent-strong);
}
.argus-explanation p{
  margin:0;
  font-size:12px;
  line-height:1.7;
  color:rgba(241,238,232,.48);
}

.argus-inline-demo.is-explained .argus-explanation{
  opacity:1;
  transform:translateY(0);
  transition:opacity .36s ease, transform .36s ease;
}
.argus-inline-demo.is-explained .argus-explanation p{
  color:rgba(241,238,232,.70);
}

@media (max-width:900px){
  .argus-window-body{
    grid-template-columns:36px 1fr;
    min-height:164px;
  }
  .argus-desktop{
    min-height:164px;
  }
  .argus-app-card.mail{
    left:18px;
    width:180px;
  }
}


/* --- v25 ui refinements --- */

/* Stable dropdown bridge so it doesn't disappear on hover transition */
.nav-dropdown{
  position:relative;
  display:flex;
  align-items:center;
  padding-bottom:16px;
  margin-bottom:-16px;
}
.nav-dropdown::after{
  content:"";
  position:absolute;
  left:-10px;
  right:-10px;
  top:100%;
  height:18px;
}
.nav-dropdown-menu{
  top:calc(100% + 2px);
}

/* Distinct project title fonts */
.project-aegis .project-name h3,
.aegis-page .inner-title{
  font-family:"Cormorant Garamond",serif !important;
  font-weight:400 !important;
  letter-spacing:-.025em !important;
}

.project-argus .project-name h3,
.argus-page .inner-title{
  font-family:"Sora",sans-serif !important;
  font-weight:700 !important;
  letter-spacing:-.05em !important;
}

.project-aegis .project-name p{
  font-size:13px !important;
}
.project-argus .project-name p{
  font-size:13px !important;
}

/* Larger descriptions under animations */
.project-demo-summary{
  max-width:760px;
}
.project-demo-lead{
  margin:0 0 14px;
  font-size:15px;
  line-height:1.85;
  color:rgba(241,238,232,.74);
}
.project-demo-points{
  font-size:13px;
  line-height:1.82;
  color:rgba(241,238,232,.63);
}
.project-demo-points li + li{
  margin-top:10px;
}

/* Non-clickable detail buttons */
.detail-chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.detail-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 13px;
  border:1px solid rgba(159,123,255,.18);
  background:rgba(159,123,255,.07);
  border-radius:999px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#efe5ff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
  user-select:none;
}

/* Argus demo richer visuals */
.argus-window{
  transition:transform .6s ease;
  transform-origin:78% 78%;
}
.argus-desktop{
  transform-origin:84% 82%;
  transition:transform .75s cubic-bezier(.2,.75,.22,1);
}
.argus-inline-demo.is-zoomed .argus-desktop{
  transform:scale(1.16);
}

.argus-app-card.mail{
  top:44px;
  left:28px;
  width:250px;
  height:98px;
  background:rgba(255,255,255,.05);
}
.argus-error-dialog{
  position:absolute;
  inset:10px 12px;
  display:grid;
  grid-template-columns:34px 1fr;
  gap:10px;
  align-items:start;
}
.argus-error-icon{
  width:28px;
  height:28px;
  border-radius:50%;
  background:#cf2d35;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:"Sora",sans-serif;
  font-size:18px;
  font-weight:700;
  box-shadow:0 0 0 2px rgba(255,255,255,.03);
}
.argus-error-copy strong{
  display:block;
  margin-top:2px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.03em;
  color:#fff;
}
.argus-error-copy p{
  margin:6px 0 0;
  font-size:10px;
  line-height:1.45;
  color:rgba(241,238,232,.72);
}

/* Analysis panel inside animated desktop */
.argus-analysis-panel{
  position:absolute;
  right:14px;
  bottom:14px;
  width:186px;
  padding:12px 12px 11px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.88);
  box-shadow:0 14px 34px rgba(0,0,0,.26);
  opacity:0;
  transform:translate3d(0,12px,0) scale(.88);
  transform-origin:100% 100%;
}
.argus-analysis-panel small{
  display:block;
  margin-bottom:6px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:8px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--accent-strong);
}
.argus-analysis-panel strong{
  display:block;
  margin:0 0 7px;
  font-family:"Sora",sans-serif;
  font-size:12px;
  font-weight:600;
  color:#fff;
}
.argus-analysis-panel p{
  margin:0 0 10px;
  font-size:10px;
  line-height:1.55;
  color:rgba(241,238,232,.72);
}
.argus-solution-lines{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.argus-solution-lines span{
  display:block;
  padding:5px 7px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.03);
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size:9px;
  color:#e9dcff;
}

.argus-inline-demo.is-panel-visible .argus-analysis-panel{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  transition:opacity .34s ease, transform .48s cubic-bezier(.22,.8,.24,1);
}

.argus-explanation{
  min-height:70px;
}

/* Slight adjustments so both icons feel aligned */
.project-icon{
  width:78px;
  height:78px;
  object-fit:contain;
}

@media (max-width:900px){
  .detail-chip{
    font-size:9px;
  }
  .project-demo-lead{
    font-size:14px;
  }
  .project-demo-points{
    font-size:12px;
  }
  .argus-app-card.mail{
    width:210px;
    left:18px;
  }
  .argus-analysis-panel{
    width:168px;
    right:10px;
    bottom:10px;
  }
}


/* --- v26 project scale and argus focus --- */

/* Larger project names in Projects section */
.project-name h3{
  font-size:39px;
  line-height:.98;
}
.project-aegis .project-name h3{
  font-size:41px !important;
}
.project-argus .project-name h3{
  font-size:41px !important;
  font-weight:600 !important;
  letter-spacing:-.04em !important;
}

/* Larger, fewer chips */
.detail-chips{
  gap:12px;
  margin-top:18px;
}
.detail-chip{
  min-height:42px;
  padding:0 18px;
  font-size:11px;
  letter-spacing:.14em;
}

/* Single toolbar button */
.argus-toolbar-chip{
  min-height:24px;
  padding:0 12px;
  font-size:9px;
  letter-spacing:.14em;
  border:1px solid rgba(159,123,255,.22);
  background:rgba(159,123,255,.10);
  color:#efe5ff;
}

/* Cursor-drawn selection */
.argus-cursor{
  position:absolute;
  left:86px;
  top:56px;
  width:18px;
  height:24px;
  opacity:0;
  z-index:4;
  pointer-events:none;
  filter:drop-shadow(0 6px 12px rgba(0,0,0,.18));
}
.argus-cursor::before{
  content:"";
  position:absolute;
  inset:0;
  background:#ffffff;
  clip-path:polygon(0 0, 0 100%, 27% 71%, 43% 100%, 56% 93%, 40% 63%, 100% 63%);
  box-shadow:0 0 0 1px rgba(0,0,0,.18);
}

/* Focus stays near panel, not whole desktop */
.argus-window{
  transform:none !important;
}
.argus-desktop{
  transform-origin:100% 100%;
  transition:transform .75s cubic-bezier(.2,.75,.22,1);
}
.argus-inline-demo.is-zoomed .argus-desktop{
  transform:translate3d(-8px,-5px,0) scale(1.035);
}

/* Panel states */
.argus-analysis-panel{
  width:202px;
  opacity:0;
  transform:translate3d(0,12px,0) scale(.88);
  transition:opacity .34s ease, transform .48s cubic-bezier(.22,.8,.24,1);
}
.argus-inline-demo.is-panel-visible .argus-analysis-panel{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}
.argus-inline-demo.is-zoomed .argus-analysis-panel{
  transform:translate3d(0,0,0) scale(1.16);
}

.argus-panel-processing,
.argus-panel-result{
  transition:opacity .28s ease, transform .32s ease;
}
.argus-panel-processing{
  opacity:1;
  transform:translateY(0);
}
.argus-panel-result{
  display:none;
  opacity:0;
  transform:translateY(6px);
}
.argus-inline-demo.is-result-visible .argus-panel-processing{
  display:none;
}
.argus-inline-demo.is-result-visible .argus-panel-result{
  display:block;
  opacity:1;
  transform:translateY(0);
}

.argus-loader{
  display:flex;
  align-items:center;
  gap:7px;
  margin-top:10px;
}
.argus-loader span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:rgba(233,220,255,.9);
  animation:argusPulse 1.1s ease-in-out infinite;
}
.argus-loader span:nth-child(2){animation-delay:.16s}
.argus-loader span:nth-child(3){animation-delay:.32s}

@keyframes argusPulse{
  0%, 80%, 100%{opacity:.25; transform:scale(.82)}
  40%{opacity:1; transform:scale(1)}
}

.argus-panel-processing small,
.argus-panel-result small{
  display:block;
  margin-bottom:6px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:8px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--accent-strong);
}
.argus-panel-processing strong,
.argus-panel-result strong{
  display:block;
  font-family:"Sora",sans-serif;
  font-size:12px;
  font-weight:600;
  color:#fff;
}
.argus-panel-result p{
  margin:8px 0 10px;
  font-size:10px;
  line-height:1.55;
  color:rgba(241,238,232,.72);
}


/* --- v27 argus sequencing and alignment --- */

/* Keep demo + summary stacked and left-aligned like Aegis */
.project-desc.project-demo-cell{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:100%;
}

.argus-inline-demo,
.project-demo-summary{
  width:100%;
  max-width:720px;
}

.project-demo-summary{
  align-self:flex-start;
}

/* Error dialog first: hidden initially, then pops in */
.argus-app-card.mail{
  opacity:0;
  transform:translateY(10px) scale(.96);
  transform-origin:30% 35%;
  transition:opacity .26s ease, transform .32s cubic-bezier(.22,.8,.24,1);
}
.argus-inline-demo.is-error-visible .argus-app-card.mail{
  opacity:1;
  transform:translateY(0) scale(1);
}

.argus-error-dialog{
  grid-template-columns:30px 1fr;
  gap:9px;
}
.argus-error-icon{
  width:24px;
  height:24px;
  font-size:15px;
}
.argus-error-copy strong{
  font-size:10px;
}
.argus-error-copy p{
  margin:4px 0 0;
  font-size:9px;
  line-height:1.35;
  max-width:140px;
}

/* Analysis text block below animation removed */
.argus-explanation{
  display:none !important;
}


/* --- v28 argus reset and precise project layout --- */

/* Bigger project titles */
.project-name h3{
  font-size:44px !important;
  line-height:.95 !important;
}
.project-aegis .project-name h3{
  font-size:46px !important;
}
.project-argus .project-name h3{
  font-size:46px !important;
  font-family:"Sora",sans-serif !important;
  font-weight:500 !important;
  letter-spacing:-.045em !important;
}

/* Match Aegis/Argus project descriptions more tightly */
.project-desc.project-demo-cell{
  width:100%;
  max-width:720px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:18px;
}
.project-demo-summary{
  width:100%;
  max-width:720px;
  margin:0;
  padding:0;
  align-self:flex-start;
}
.project-demo-lead{
  font-size:15px !important;
  line-height:1.85 !important;
}
.project-demo-points{
  font-size:13px !important;
  line-height:1.82 !important;
}

/* Bigger buttons, max four, visually closer to product tags */
.detail-chips{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}
.detail-chip{
  min-height:46px !important;
  padding:0 20px !important;
  font-size:11px !important;
  letter-spacing:.14em !important;
  background:rgba(159,123,255,.08) !important;
  border:1px solid rgba(159,123,255,.20) !important;
}

/* Argus uses same width discipline as Aegis */
.argus-inline-demo{
  width:100%;
  max-width:720px;
  min-width:0;
  pointer-events:none;
}
.argus-demo-shell{
  width:100%;
}

/* Important: keep interactive layers completely invisible until activated */
.argus-app-card.mail,
.argus-cursor,
.argus-selection,
.argus-capture,
.argus-plane,
.argus-analysis-panel{
  opacity:0;
  visibility:hidden;
}

/* Error appears first */
.argus-inline-demo.is-error-visible .argus-app-card.mail{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
}
.argus-app-card.mail{
  transform:translateY(10px) scale(.96);
  transition:opacity .26s ease, transform .32s cubic-bezier(.22,.8,.24,1), visibility 0s linear .32s;
}

/* Cursor + red box only when selection starts */
.argus-inline-demo.is-selecting .argus-cursor,
.argus-inline-demo.is-selecting .argus-selection{
  visibility:visible;
}
.argus-inline-demo.is-capturing .argus-capture,
.argus-inline-demo.is-capturing .argus-plane{
  visibility:visible;
}

/* Panel only when transfer/result state starts */
.argus-inline-demo.is-panel-visible .argus-analysis-panel{
  opacity:1;
  visibility:visible;
  transform:translate3d(0,0,0) scale(1);
  transition:opacity .34s ease, transform .48s cubic-bezier(.22,.8,.24,1), visibility 0s linear 0s;
}

.argus-toolbar-chip{
  min-height:26px;
  padding:0 14px;
  font-size:9px;
  letter-spacing:.14em;
}

.argus-cursor{
  z-index:6;
}
.argus-selection{
  z-index:5;
}
.argus-capture{
  z-index:7;
}
.argus-plane{
  z-index:8;
}
.argus-analysis-panel{
  z-index:9;
  width:206px;
}

.argus-inline-demo.is-zoomed .argus-desktop{
  transform:translate3d(-8px,-5px,0) scale(1.035);
}
.argus-inline-demo.is-zoomed .argus-analysis-panel{
  transform:translate3d(0,0,0) scale(1.16);
}

.argus-panel-processing{
  opacity:1;
  display:block;
}
.argus-panel-result{
  display:none;
  opacity:0;
}
.argus-inline-demo.is-result-visible .argus-panel-processing{
  display:none;
}
.argus-inline-demo.is-result-visible .argus-panel-result{
  display:block;
  opacity:1;
}

@media (max-width:900px){
  .project-name h3,
  .project-aegis .project-name h3,
  .project-argus .project-name h3{
    font-size:38px !important;
  }
  .detail-chip{
    min-height:42px !important;
    padding:0 16px !important;
    font-size:10px !important;
  }
}


/* --- v29 home/content refinement --- */

/* Hero copy */
.hero-kicker{
  font-size:18px;
}
.hero-intro{
  margin:34px 0 0;
  max-width:760px;
  font-size:14px;
  line-height:1.95;
  color:rgba(241,238,232,.62);
}

/* Remove dependence on old hero-floor layout */
.hero-center{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

/* Projects header: larger heading, description below */
.projects{
  padding:54px 0 130px;
}
.projects-head{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start;
  gap:18px;
  margin-bottom:54px;
}
.projects-title{
  font-size:clamp(62px,8vw,118px) !important;
  line-height:.92 !important;
  letter-spacing:-.065em !important;
}
.projects-subtext{
  margin:0;
  max-width:760px;
  color:rgba(241,238,232,.60);
  font-size:14px;
  line-height:1.9;
}

/* Bigger project titles */
.project-name h3{
  font-size:48px !important;
  line-height:.93 !important;
}
.project-aegis .project-name h3{
  font-size:52px !important;
}
.project-argus .project-name h3{
  font-size:48px !important;
}

/* More breathing room between animation and summaries */
.project-desc.project-demo-cell{
  gap:26px !important;
}
.project-demo-summary{
  margin-top:8px;
}

/* Bigger, bolder chips */
.detail-chip{
  min-height:50px !important;
  padding:0 22px !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.13em !important;
}

/* Contact page / footer alignment */
.site-footer .footer-col a{
  display:block;
}

/* Responsive */
@media (max-width:900px){
  .projects-title{
    font-size:clamp(48px,13vw,84px) !important;
  }
  .project-name h3,
  .project-aegis .project-name h3,
  .project-argus .project-name h3{
    font-size:38px !important;
  }
  .detail-chip{
    min-height:44px !important;
    padding:0 16px !important;
  }
}


/* --- v30 spacing, orbit and project-page icons --- */

/* Ellipse stage: a bit more presence */
.ellipse-stage{
  width:min(72vw,900px);
  margin:24px auto 0;
}
.orbit-path{
  stroke:rgba(241,238,232,.16);
  stroke-width:1.2;
}

/* Slower, more noticeable but not constantly moving the same way */
.orbit-layer{
  transform-origin:490px 270px;
}
.orbit-layer.layer-one{
  animation:layerDriftOne 30s ease-in-out infinite;
}
.orbit-layer.layer-two{
  animation:layerDriftTwo 37s ease-in-out infinite;
}
.orbit-layer.layer-three{
  animation:layerDriftThree 43s ease-in-out infinite;
}

.orbit-dot{
  fill:#f1eee8;
  filter:drop-shadow(0 0 6px rgba(255,255,255,.42));
}
.orbit-dot.secondary{
  opacity:.78;
}
.orbit-dot.glow-slow{
  animation:dotGlowPulse 16s ease-in-out infinite;
}
.orbit-dot.glow-medium{
  animation:dotGlowPulse 19s ease-in-out infinite;
  animation-delay:-6s;
}
.orbit-dot.glow-fast{
  animation:dotGlowPulse 14s ease-in-out infinite;
  animation-delay:-3s;
}

@keyframes layerDriftOne{
  0%, 18%   { transform:translateY(0px) rotate(-1.2deg); }
  30%, 45%  { transform:translateY(-10px) rotate(.3deg); }
  58%, 78%  { transform:translateY(7px) rotate(1.8deg); }
  100%      { transform:translateY(-2px) rotate(.2deg); }
}
@keyframes layerDriftTwo{
  0%, 15%   { transform:translateY(2px) rotate(1.4deg); }
  28%, 44%  { transform:translateY(12px) rotate(-.5deg); }
  62%, 82%  { transform:translateY(-8px) rotate(-1.8deg); }
  100%      { transform:translateY(1px) rotate(.6deg); }
}
@keyframes layerDriftThree{
  0%, 22%   { transform:translateY(-2px) rotate(.8deg); }
  38%, 55%  { transform:translateY(9px) rotate(2deg); }
  72%, 88%  { transform:translateY(-12px) rotate(-.8deg); }
  100%      { transform:translateY(0px) rotate(.4deg); }
}
@keyframes dotGlowPulse{
  0%, 54%{
    filter:drop-shadow(0 0 5px rgba(255,255,255,.34));
    transform:scale(1);
  }
  80%{
    filter:
      drop-shadow(0 0 8px rgba(255,255,255,.75))
      drop-shadow(0 0 18px rgba(255,255,255,.5))
      drop-shadow(0 0 32px rgba(255,255,255,.28));
    transform:scale(1.05);
  }
  100%{
    filter:drop-shadow(0 0 6px rgba(255,255,255,.42));
    transform:scale(1);
  }
}

/* More breathing room for project blocks */
.projects{
  padding:62px 0 150px;
}
.project{
  grid-template-columns:118px 250px 1fr 118px;
  gap:34px;
  padding:42px 0;
}
.project:hover{
  padding-left:10px;
}
.project-desc.project-demo-cell{
  max-width:760px;
  gap:34px !important;
}
.project-demo-summary{
  max-width:760px;
  margin-top:12px !important;
}
.project-demo-lead{
  margin:0 0 18px;
}
.project-demo-points{
  margin:0;
}
.detail-chips{
  gap:14px;
  margin-top:24px !important;
}
.detail-chip{
  min-height:54px !important;
  padding:0 24px !important;
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:.12em !important;
}

/* A bit more visual room in demo cards */
.aegis-inline-demo,
.argus-inline-demo{
  max-width:760px;
}

/* Project page icons instead of PROJECT 01/02 */
.project-heading-row{
  grid-template-columns:170px 1fr;
  gap:36px;
}
.project-page-icon{
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  padding-top:8px;
}
.project-page-icon img{
  width:112px;
  height:112px;
  object-fit:contain;
  display:block;
}
.inner-label{
  display:none;
}

/* Better mobile fit */
@media(max-width:980px){
  .project{
    grid-template-columns:90px 220px 1fr;
    gap:24px;
    padding:38px 0;
  }
}
@media(max-width:820px){
  .project-heading-row{
    grid-template-columns:1fr;
    gap:22px;
  }
  .project-page-icon{
    padding-top:0;
  }
  .project-page-icon img{
    width:88px;
    height:88px;
  }
}


/* --- v31 glow and spacing refinement --- */

/* More air between descriptive text and chips */
.project-demo-summary{
  margin-top:18px !important;
}
.project-demo-lead{
  margin:0 0 22px !important;
}
.project-demo-points{
  margin:0 0 10px 0 !important;
}
.detail-chips{
  margin-top:32px !important;
  gap:16px !important;
}
.detail-chip{
  min-height:58px !important;
  padding:0 26px !important;
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:.12em !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.03),
    0 0 0 1px rgba(159,123,255,.08);
}

/* Stronger orbit-dot glow with much wider outer bloom */
.orbit-dot{
  fill:#f1eee8;
  filter:
    drop-shadow(0 0 8px rgba(255,255,255,.52))
    drop-shadow(0 0 16px rgba(255,255,255,.18));
}
.orbit-dot.glow-slow{
  animation:dotGlowPulseLarge 16s ease-in-out infinite;
}
.orbit-dot.glow-medium{
  animation:dotGlowPulseLarge 19s ease-in-out infinite;
  animation-delay:-6s;
}
.orbit-dot.glow-fast{
  animation:dotGlowPulseLarge 14s ease-in-out infinite;
  animation-delay:-3s;
}

@keyframes dotGlowPulseLarge{
  0%, 52%{
    filter:
      drop-shadow(0 0 7px rgba(255,255,255,.42))
      drop-shadow(0 0 16px rgba(255,255,255,.18));
    transform:scale(1);
    opacity:1;
  }
  76%{
    filter:
      drop-shadow(0 0 12px rgba(255,255,255,.92))
      drop-shadow(0 0 28px rgba(255,255,255,.68))
      drop-shadow(0 0 54px rgba(255,255,255,.46))
      drop-shadow(0 0 92px rgba(255,255,255,.24));
    transform:scale(1.08);
    opacity:1;
  }
  86%{
    filter:
      drop-shadow(0 0 16px rgba(255,255,255,1))
      drop-shadow(0 0 36px rgba(255,255,255,.84))
      drop-shadow(0 0 70px rgba(255,255,255,.62))
      drop-shadow(0 0 120px rgba(255,255,255,.36))
      drop-shadow(0 0 170px rgba(255,255,255,.18));
    transform:scale(1.12);
    opacity:1;
  }
  100%{
    filter:
      drop-shadow(0 0 8px rgba(255,255,255,.52))
      drop-shadow(0 0 16px rgba(255,255,255,.18));
    transform:scale(1);
    opacity:1;
  }
}

/* After the main Noirin glow ends, the title briefly matches the background
   and then fades back to its natural violet tone over 3 seconds. */
.hero-title.glow-reset-fade{
  animation:noirinReturnFromBg 3000ms ease forwards;
  text-shadow:none !important;
}
@keyframes noirinReturnFromBg{
  0%{
    color:var(--bg);
    text-shadow:none;
  }
  35%{
    color:rgba(75,67,95,.52);
    text-shadow:none;
  }
  68%{
    color:rgba(131,104,204,.78);
    text-shadow:
      0 0 12px rgba(159,123,255,.06),
      0 0 22px rgba(159,123,255,.025);
  }
  100%{
    color:var(--accent-strong);
    text-shadow:none;
  }
}


/* --- v32 refined glow and argus update --- */

/* Smaller home kicker */
.hero-kicker{
  font-size:clamp(9px,.82vw,12px) !important;
  letter-spacing:.19em !important;
  margin:26px 0 0 !important;
}

/* Stronger, larger orbit-dot glow */
.orbit-dot{
  filter:
    drop-shadow(0 0 10px rgba(255,255,255,.58))
    drop-shadow(0 0 24px rgba(255,255,255,.26)) !important;
}
.orbit-dot.glow-slow{
  animation:dotGlowPulseXL 16s ease-in-out infinite !important;
}
.orbit-dot.glow-medium{
  animation:dotGlowPulseXL 19s ease-in-out infinite !important;
  animation-delay:-6s !important;
}
.orbit-dot.glow-fast{
  animation:dotGlowPulseXL 14s ease-in-out infinite !important;
  animation-delay:-3s !important;
}
@keyframes dotGlowPulseXL{
  0%, 50%{
    filter:
      drop-shadow(0 0 8px rgba(255,255,255,.44))
      drop-shadow(0 0 20px rgba(255,255,255,.18))
      drop-shadow(0 0 38px rgba(255,255,255,.10));
    transform:scale(1);
    opacity:1;
  }
  76%{
    filter:
      drop-shadow(0 0 16px rgba(255,255,255,.98))
      drop-shadow(0 0 38px rgba(255,255,255,.82))
      drop-shadow(0 0 78px rgba(255,255,255,.58))
      drop-shadow(0 0 132px rgba(255,255,255,.34))
      drop-shadow(0 0 210px rgba(255,255,255,.16));
    transform:scale(1.10);
    opacity:1;
  }
  88%{
    filter:
      drop-shadow(0 0 19px rgba(255,255,255,1))
      drop-shadow(0 0 48px rgba(255,255,255,.92))
      drop-shadow(0 0 96px rgba(255,255,255,.72))
      drop-shadow(0 0 170px rgba(255,255,255,.44))
      drop-shadow(0 0 270px rgba(255,255,255,.20));
    transform:scale(1.14);
    opacity:1;
  }
  100%{
    filter:
      drop-shadow(0 0 10px rgba(255,255,255,.58))
      drop-shadow(0 0 24px rgba(255,255,255,.26));
    transform:scale(1);
    opacity:1;
  }
}

/* More space between summary and buttons */
.project-demo-lead{
  margin:0 0 24px !important;
}
.project-demo-points{
  margin:0 0 14px 0 !important;
}
.detail-chips{
  margin-top:40px !important;
}
.detail-chip{
  min-height:60px !important;
  padding:0 28px !important;
  font-weight:700 !important;
}

/* Noirin fade back after staying hidden */
.hero-title.glow-reset-fade{
  animation:noirinReturnFromBgHold 4000ms ease forwards !important;
  text-shadow:none !important;
}
@keyframes noirinReturnFromBgHold{
  0%, 25%{
    color:var(--bg);
    text-shadow:none;
  }
  45%{
    color:rgba(65,58,84,.38);
    text-shadow:none;
  }
  70%{
    color:rgba(121,93,196,.72);
    text-shadow:
      0 0 14px rgba(159,123,255,.06),
      0 0 24px rgba(159,123,255,.025);
  }
  100%{
    color:var(--accent-strong);
    text-shadow:none;
  }
}

/* Argus title/toolbar adjustments */
.argus-window-title{
  letter-spacing:.08em;
}
.argus-toolbar{
  display:none !important;
}

/* Keep error sizing clear */
.argus-app-card.mail{
  top:44px !important;
  left:28px !important;
  width:250px !important;
  height:98px !important;
}

/* Selection and capture shape tuned to cover whole error block */
.argus-selection{
  border:2px solid #d13a43 !important;
  box-shadow:
    0 0 0 1px rgba(209,58,67,.24),
    0 0 24px rgba(209,58,67,.12) !important;
}
.argus-capture{
  border:1px solid rgba(209,58,67,.26) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
    rgba(11,11,13,.96) !important;
}














/* --- v39 focused physiotherapy website example --- */
.pm39-main{
  padding-top:126px;
  width:min(100%, var(--max));
  margin:auto;
}
.pm39-intro{
  padding:34px 0 62px;
}
.pm39-kicker,
.pm39-overline,
.pm39-side-brand span,
.pm39-side-note span,
.pm39-side-nav a{
  display:block;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:10px;
}
.pm39-intro h1{
  margin:10px 0 0;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:clamp(56px,7vw,106px);
  line-height:.92;
  letter-spacing:-.06em;
  font-weight:600;
}
.pm39-intro h2{
  margin:46px 0 0;
  max-width:980px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(34px,4.4vw,72px);
  font-weight:600;
  line-height:.94;
  letter-spacing:-.04em;
}
.pm39-intro p{
  margin:24px 0 0;
  max-width:760px;
  color:rgba(241,238,232,.70);
  font-size:15px;
  line-height:1.9;
}

.pm39-preview-wrap{
  width:100vw;
  margin-left:calc(50% - 50vw);
  padding-bottom:86px;
}
.pm39-preview{
  background:linear-gradient(180deg,#f3ece2 0%,#f8f3eb 40%,#efe6db 100%);
  color:#231d18;
  min-height:100vh;
}
.pm39-preview-grid{
  display:grid;
  grid-template-columns:270px minmax(0,1fr);
  gap:0;
  min-height:100vh;
}
.pm39-sidebar{
  border-right:1px solid rgba(35,29,24,.10);
  background:rgba(255,248,241,.55);
}
.pm39-sidebar-inner{
  position:sticky;
  top:98px;
  padding:38px 28px 42px;
}
.pm39-side-brand strong{
  display:block;
  margin-top:12px;
  font-family:"Cormorant Garamond",serif;
  font-size:36px;
  line-height:.95;
  font-weight:600;
  letter-spacing:-.04em;
}
.pm39-side-brand em{
  display:block;
  margin-top:10px;
  font-style:normal;
  color:rgba(35,29,24,.62);
  font-size:14px;
  line-height:1.7;
}
.pm39-side-nav{
  display:grid;
  gap:14px;
  margin:34px 0;
}
.pm39-side-nav a{
  color:rgba(35,29,24,.70);
  padding-bottom:8px;
  border-bottom:1px solid rgba(35,29,24,.10);
}
.pm39-side-nav a:hover{ color:#231d18; }
.pm39-side-note{
  padding-top:10px;
  color:rgba(35,29,24,.70);
}
.pm39-side-note p{
  margin:10px 0 0;
  font-size:14px;
  line-height:1.8;
}

.pm39-content{
  padding:34px clamp(26px,4vw,74px) 74px;
}
.pm39-hero,
.pm39-welcome,
.pm39-contact-band{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(360px,.95fr);
  gap:34px;
  align-items:center;
}
.pm39-hero{ padding:8px 0 54px; }
.pm39-hero-copy h3,
.pm39-welcome-copy h3,
.pm39-section-head h3,
.pm39-contact-copy h3{
  margin:12px 0 18px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(38px,4vw,70px);
  font-weight:600;
  line-height:.96;
  letter-spacing:-.04em;
}
.pm39-lead,
.pm39-hero-copy p,
.pm39-welcome-copy p,
.pm39-section-head p,
.pm39-service-list p,
.pm39-course-item span,
.pm39-contact-copy p,
.pm39-contact-points li{
  font-size:15px;
  line-height:1.9;
}
.pm39-lead{
  color:#766456;
  margin:0 0 8px;
}
.pm39-action-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:24px;
}
.pm39-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 22px;
  border-radius:999px;
  border:1px solid rgba(35,29,24,.18);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#231d18;
}
.pm39-pill.active{
  background:#2f5c53;
  border-color:#2f5c53;
  color:#fbf7f1;
}
.pm39-hero-image,
.pm39-inline-image{ margin:0; }
.pm39-hero-image img,
.pm39-inline-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.pm39-hero-image img{ min-height:660px; }
.pm39-inline-image img{ min-height:520px; }
.pm39-inline-image.right-image{
  justify-self:end;
  width:min(100%, 640px);
}
.pm39-inline-image.left-image{
  width:min(100%, 590px);
}
.pm39-welcome{
  padding:62px 0 56px;
  border-top:1px solid rgba(35,29,24,.09);
}
.pm39-services,
.pm39-courses,
.pm39-contact-band{
  padding:60px 0 10px;
  border-top:1px solid rgba(35,29,24,.09);
}
.pm39-section-head{
  max-width:840px;
  margin-bottom:24px;
}
.pm39-service-list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:26px 34px;
}
.pm39-service-list article{
  padding:0 0 20px;
  border-bottom:1px solid rgba(35,29,24,.11);
}
.pm39-service-list h4,
.pm39-course-item strong{
  margin:0 0 10px;
  display:block;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:18px;
  line-height:1.35;
  letter-spacing:-.02em;
}
.pm39-course-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.pm39-course-item{
  padding:18px 0 24px;
  border-top:1px solid rgba(35,29,24,.12);
}
.pm39-contact-band{
  grid-template-columns:minmax(0,.82fr) minmax(360px,.96fr);
  align-items:start;
  padding-bottom:74px;
}
.pm39-contact-copy{ max-width:760px; }
.pm39-contact-points{
  margin:18px 0 0 18px;
  padding:0;
}
.pm39-contact-points li{ margin:0 0 8px; }

@media (max-width: 1120px){
  .pm39-preview-grid{ grid-template-columns:1fr; }
  .pm39-sidebar{ border-right:0; border-bottom:1px solid rgba(35,29,24,.10); }
  .pm39-sidebar-inner{ position:relative; top:0; }
}
@media (max-width: 980px){
  .pm39-hero,
  .pm39-welcome,
  .pm39-contact-band,
  .pm39-service-list,
  .pm39-course-row{
    grid-template-columns:1fr;
  }
  .pm39-hero-image img,
  .pm39-inline-image img{ min-height:420px; }
}
@media (max-width: 700px){
  .pm39-main{ padding-top:104px; }
  .pm39-content{ padding:24px 20px 56px; }
  .pm39-sidebar-inner{ padding:26px 20px 30px; }
  .pm39-intro{ padding:18px 0 42px; }
  .pm39-intro h2{ margin-top:34px; }
}


/* --- v40 generalized website-design page --- */
.pm40-main{
  padding-top:126px;
  width:min(100%, var(--max));
  margin:auto;
}
.pm40-intro{
  padding:28px 0 68px;
}
.pm40-kicker,
.pm40-overline,
.pm40-side-brand span,
.pm40-side-note span,
.pm40-side-nav a{
  display:block;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:10px;
}
.pm40-intro h1{
  margin:10px 0 0;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:clamp(56px,7vw,106px);
  line-height:.92;
  letter-spacing:-.06em;
  font-weight:600;
}
.pm40-intro p{
  margin:34px 0 0;
  max-width:790px;
  color:rgba(241,238,232,.72);
  font-size:15px;
  line-height:1.9;
}
.pm40-preview-wrap{
  width:100vw;
  margin-left:calc(50% - 50vw);
  padding-bottom:88px;
}
.pm40-preview{
  background:linear-gradient(180deg,#f1ece4 0%,#f7f2ea 40%,#eee5d9 100%);
  color:#231d18;
  min-height:100vh;
}
.pm40-grid{
  display:grid;
  grid-template-columns:270px minmax(0,1fr);
  min-height:100vh;
}
.pm40-sidebar{
  background:rgba(255,248,241,.46);
  border-right:1px solid rgba(35,29,24,.10);
}
.pm40-sidebar-inner{
  position:sticky;
  top:98px;
  padding:38px 28px 42px;
}
.pm40-side-brand strong{
  display:block;
  margin-top:12px;
  font-family:"Cormorant Garamond",serif;
  font-size:36px;
  line-height:.95;
  font-weight:600;
  letter-spacing:-.04em;
}
.pm40-side-brand em{
  display:block;
  margin-top:10px;
  font-style:normal;
  color:rgba(35,29,24,.62);
  font-size:14px;
  line-height:1.7;
}
.pm40-side-nav{ display:grid; gap:14px; margin:34px 0; }
.pm40-side-nav a{
  color:rgba(35,29,24,.74);
  padding-bottom:8px;
  border-bottom:1px solid rgba(35,29,24,.10);
}
.pm40-side-nav a:hover{ color:#231d18; }
.pm40-side-note{ color:rgba(35,29,24,.70); }
.pm40-side-note p{ margin:10px 0 0; font-size:14px; line-height:1.8; }

.pm40-content{
  padding:38px clamp(26px,4vw,74px) 82px;
}
.pm40-hero,
.pm40-about,
.pm40-contact{
  display:grid;
  grid-template-columns:minmax(0,.94fr) minmax(360px,.96fr);
  gap:34px;
  align-items:center;
}
.pm40-copy h2,
.pm40-about-copy h3,
.pm40-section-head h3,
.pm40-contact-copy h3{
  margin:12px 0 18px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(40px,4.3vw,72px);
  font-weight:600;
  line-height:.95;
  letter-spacing:-.04em;
}
.pm40-copy p,
.pm40-about-copy p,
.pm40-section-head p,
.pm40-service-grid p,
.pm40-option-copy p,
.pm40-contact-copy p,
.pm40-form label span,
.pm40-form-footer p,
.pm40-lead{
  font-size:15px;
  line-height:1.9;
}
.pm40-lead{ color:#746354; margin:0 0 8px; }
.pm40-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:24px;
}
.pm40-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 22px;
  border-radius:999px;
  border:1px solid rgba(35,29,24,.18);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#231d18;
}
.pm40-btn-primary{ background:#2f5c53; border-color:#2f5c53; color:#fbf7f1; }
.pm40-hero{ padding:8px 0 56px; }
.pm40-hero-media,
.pm40-side-image{ margin:0; }
.pm40-hero-media img,
.pm40-side-image img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.pm40-hero-media img{ min-height:680px; }
.pm40-side-image img{ min-height:520px; }
.pm40-about{
  padding:60px 0 56px;
  border-top:1px solid rgba(35,29,24,.09);
}
.pm40-side-image.right{ justify-self:end; width:min(100%, 650px); }
.pm40-side-image.left{ width:min(100%, 590px); }
.pm40-services,
.pm40-options,
.pm40-contact{
  padding:60px 0 14px;
  border-top:1px solid rgba(35,29,24,.09);
  scroll-margin-top:120px;
}
#pm40-hero,#pm40-about,#pm40-services,#pm40-options,#pm40-contact{ scroll-margin-top:120px; }
.pm40-section-head{ max-width:850px; margin-bottom:28px; }
.pm40-section-head.narrow{ max-width:780px; }
.pm40-service-panel{
  background:#ffffff;
  border:1px solid rgba(35,29,24,.08);
  padding:28px;
}
.pm40-service-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:26px 34px;
}
.pm40-service-grid article{
  padding:0 0 18px;
  border-bottom:1px solid rgba(35,29,24,.11);
}
.pm40-service-grid h4{
  margin:0 0 10px;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:18px;
  line-height:1.35;
  letter-spacing:-.02em;
}
.pm40-options-grid{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(360px,.98fr);
  gap:34px;
  align-items:start;
}
.pm40-option-copy p{ margin-top:0; }
.pm40-contact{
  align-items:start;
  padding-bottom:76px;
}
.pm40-form{
  background:rgba(255,255,255,.54);
  border:1px solid rgba(35,29,24,.10);
  padding:28px;
}
.pm40-form-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.pm40-form label{ display:block; }
.pm40-form label span{
  display:block;
  margin-bottom:8px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.pm40-form input,
.pm40-form select,
.pm40-form textarea{
  width:100%;
  border:1px solid rgba(35,29,24,.14);
  background:rgba(255,255,255,.82);
  color:#231d18;
  font:inherit;
  padding:14px 16px;
  outline:none;
}
.pm40-form textarea{ resize:vertical; min-height:180px; }
.pm40-full{ display:block; margin-top:18px; }
.pm40-form-footer{
  display:flex;
  gap:20px;
  justify-content:space-between;
  align-items:center;
  margin-top:22px;
}
.pm40-form-footer p{ margin:0; max-width:500px; color:rgba(35,29,24,.70); }
.pm40-form-footer button{
  min-height:48px;
  padding:0 22px;
  border:0;
  background:#231d18;
  color:#fff;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
}
@media (max-width: 1120px){
  .pm40-grid{ grid-template-columns:1fr; }
  .pm40-sidebar{ border-right:0; border-bottom:1px solid rgba(35,29,24,.10); }
  .pm40-sidebar-inner{ position:relative; top:0; }
}
@media (max-width: 980px){
  .pm40-hero,
  .pm40-about,
  .pm40-contact,
  .pm40-options-grid,
  .pm40-service-grid,
  .pm40-form-grid{
    grid-template-columns:1fr;
  }
  .pm40-hero-media img,
  .pm40-side-image img{ min-height:420px; }
  .pm40-form-footer{ flex-direction:column; align-items:flex-start; }
}
@media (max-width: 700px){
  .pm40-main{ padding-top:104px; }
  .pm40-intro{ padding:18px 0 42px; }
  .pm40-content{ padding:24px 20px 56px; }
  .pm40-sidebar-inner{ padding:26px 20px 30px; }
  .pm40-service-panel, .pm40-form{ padding:20px; }
}


/* --- v41 website-design refinement --- */
.pm41-main{
  padding-top:126px;
  width:min(100%, var(--max));
  margin:auto;
}
.pm41-kicker,
.pm41-overline,
.pm41-side-brand span,
.pm41-side-nav a{
  display:block;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:10px;
}
.pm41-intro{
  padding:32px 0 116px;
}
.pm41-intro h1{
  margin:10px 0 0;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:clamp(56px,7vw,106px);
  line-height:.92;
  letter-spacing:-.06em;
  font-weight:600;
}
.pm41-intro-copy{
  margin:34px 0 0;
  max-width:770px;
  color:rgba(241,238,232,.72);
  font-size:15px;
  line-height:1.9;
}
.pm41-traits{
  margin:34px 0 0;
  max-width:900px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(26px,3vw,40px);
  line-height:1.15;
  color:rgba(241,238,232,.92);
  letter-spacing:-.03em;
}
.pm41-preview-wrap{
  width:100vw;
  margin-left:calc(50% - 50vw);
  padding-bottom:88px;
}
.pm41-preview{
  background:linear-gradient(180deg,#f1ece4 0%,#f7f2ea 40%,#eee5d9 100%);
  color:#231d18;
  min-height:100vh;
}
.pm41-grid{
  display:grid;
  grid-template-columns:270px minmax(0,1fr);
  min-height:100vh;
}
.pm41-sidebar{
  background:rgba(255,248,241,.46);
  border-right:1px solid rgba(35,29,24,.10);
}
.pm41-sidebar-inner{
  position:sticky;
  top:98px;
  padding:38px 28px 42px;
}
.pm41-side-brand strong{
  display:block;
  margin-top:12px;
  font-family:"Cormorant Garamond",serif;
  font-size:36px;
  line-height:.95;
  font-weight:600;
  letter-spacing:-.04em;
}
.pm41-side-brand em{
  display:block;
  margin-top:10px;
  font-style:normal;
  color:rgba(35,29,24,.62);
  font-size:14px;
  line-height:1.7;
}
.pm41-side-nav{ display:grid; gap:14px; margin:34px 0; }
.pm41-side-nav a{
  color:rgba(35,29,24,.74);
  padding-bottom:8px;
  border-bottom:1px solid rgba(35,29,24,.10);
}
.pm41-side-nav a:hover{ color:#231d18; }
.pm41-content{
  padding:38px clamp(26px,4vw,74px) 82px;
}
.pm41-hero,
.pm41-about,
.pm41-contact{
  display:grid;
  grid-template-columns:minmax(0,.94fr) minmax(360px,.96fr);
  gap:42px;
  align-items:center;
}
.pm41-copy h2,
.pm41-about-copy h3,
.pm41-option-copy h3,
.pm41-section-head h3,
.pm41-contact-copy h3{
  margin:12px 0 18px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(40px,4.3vw,72px);
  font-weight:600;
  line-height:.95;
  letter-spacing:-.04em;
}
.pm41-copy p,
.pm41-about-copy p,
.pm41-option-copy p,
.pm41-section-head p,
.pm41-service-grid p,
.pm41-contact-copy p,
.pm41-form label span,
.pm41-form-footer p{
  font-size:15px;
  line-height:1.9;
}
.pm41-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:24px;
}
.pm41-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 22px;
  border-radius:999px;
  border:1px solid rgba(35,29,24,.18);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#231d18;
}
.pm41-btn-primary{ background:#2f5c53; border-color:#2f5c53; color:#fbf7f1; }
.pm41-hero{ padding:8px 0 56px; scroll-margin-top:120px; }
.pm41-hero-media,
.pm41-side-image{ margin:0; }
.pm41-hero-media img{
  width:100%;
  height:auto;
  display:block;
  object-fit:contain;
  border:none;
}
.pm41-about{
  padding:60px 0 56px;
  border-top:1px solid rgba(35,29,24,.09);
  scroll-margin-top:120px;
}
.pm41-side-image img{
  width:100%;
  height:auto;
  display:block;
}
.pm41-side-image.right-image{ justify-self:end; width:min(100%, 620px); }
.pm41-services,
.pm41-options,
.pm41-contact{
  padding:60px 0 16px;
  border-top:1px solid rgba(35,29,24,.09);
  scroll-margin-top:120px;
}
.pm41-section-head{ max-width:740px; margin-bottom:28px; }
.pm41-service-panel{
  background:#ffffff;
  border:1px solid rgba(35,29,24,.08);
  padding:28px;
}
.pm41-service-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:26px 34px;
}
.pm41-service-grid article{
  padding:0 0 18px;
  border-bottom:1px solid rgba(35,29,24,.11);
}
.pm41-service-grid h4{
  margin:0 0 10px;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:18px;
  line-height:1.35;
  letter-spacing:-.02em;
}
.pm41-options{
  display:grid;
  grid-template-columns:minmax(360px,.98fr) minmax(0,.82fr);
  gap:42px;
  align-items:center;
}
.pm41-side-image.left-image{ width:min(100%, 640px); justify-self:start; }
.pm41-contact{
  align-items:start;
  padding-bottom:76px;
}
.pm41-form{
  background:rgba(255,255,255,.54);
  border:1px solid rgba(35,29,24,.10);
  padding:28px;
}
.pm41-form-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.pm41-form label{ display:block; }
.pm41-form label span{
  display:block;
  margin-bottom:8px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.pm41-form input,
.pm41-form select,
.pm41-form textarea{
  width:100%;
  border:1px solid rgba(35,29,24,.14);
  background:rgba(255,255,255,.82);
  color:#231d18;
  font:inherit;
  padding:14px 16px;
  outline:none;
}
.pm41-form textarea{ resize:vertical; min-height:180px; }
.pm41-full{ display:block; margin-top:18px; }
.pm41-form-footer{
  display:flex;
  gap:20px;
  justify-content:space-between;
  align-items:center;
  margin-top:22px;
}
.pm41-form-footer p{ margin:0; max-width:500px; color:rgba(35,29,24,.70); }
.pm41-form-footer button{
  min-height:48px;
  padding:0 22px;
  border:0;
  background:#231d18;
  color:#fff;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
}
.pm41-scroll-hint{
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  z-index:25;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  pointer-events:none;
  color:rgba(255,255,255,.86);
  mix-blend-mode:screen;
}
.pm41-scroll-hint span{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.18em;
}
.pm41-arrow{
  font-family:"Cormorant Garamond",serif;
  font-size:60px;
  line-height:1;
}
@media (max-width: 1120px){
  .pm41-grid{ grid-template-columns:1fr; }
  .pm41-sidebar{ border-right:0; border-bottom:1px solid rgba(35,29,24,.10); }
  .pm41-sidebar-inner{ position:relative; top:0; }
}
@media (max-width: 980px){
  .pm41-hero,
  .pm41-about,
  .pm41-contact,
  .pm41-options,
  .pm41-service-grid,
  .pm41-form-grid{
    grid-template-columns:1fr;
  }
  .pm41-side-image.left-image,
  .pm41-side-image.right-image{ width:100%; }
  .pm41-form-footer{ flex-direction:column; align-items:flex-start; }
}
@media (max-width: 700px){
  .pm41-main{ padding-top:104px; }
  .pm41-intro{ padding:18px 0 76px; }
  .pm41-content{ padding:24px 20px 56px; }
  .pm41-sidebar-inner{ padding:26px 20px 30px; }
  .pm41-service-panel, .pm41-form{ padding:20px; }
  .pm41-scroll-hint{ bottom:10px; }
  .pm41-arrow{ font-size:48px; }
}


/* --- v42 website-design refinement --- */
.pm42-main{
  padding-top:126px;
  width:min(100%, var(--max));
  margin:auto;
}
.pm42-kicker,
.pm42-overline,
.pm42-side-nav a{
  display:block;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:10px;
}
.pm42-intro{
  padding:34px 0 0;
}
.pm42-intro h1{
  margin:10px 0 0;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:clamp(56px,7vw,106px);
  line-height:.92;
  letter-spacing:-.06em;
  font-weight:600;
}
.pm42-intro-copy{
  margin:34px 0 0;
  max-width:760px;
  color:rgba(241,238,232,.72);
  font-size:15px;
  line-height:1.9;
}
.pm42-preview-lead{
  padding:82px 0 148px;
}
.pm42-traits{
  margin:0;
  max-width:900px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(28px,3vw,42px);
  line-height:1.1;
  color:rgba(241,238,232,.92);
  letter-spacing:-.03em;
}
.pm42-preview-wrap{
  width:100vw;
  margin-left:calc(50% - 50vw);
  padding-bottom:88px;
}
.pm42-preview{
  background:linear-gradient(180deg,#f1ece4 0%,#f7f2ea 40%,#eee5d9 100%);
  color:#231d18;
  min-height:100vh;
}
.pm42-grid{
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  min-height:100vh;
}
.pm42-sidebar{
  background:rgba(255,248,241,.48);
  border-right:1px solid rgba(35,29,24,.10);
}
.pm42-sidebar-inner{
  position:sticky;
  top:98px;
  padding:42px 28px 42px;
}
.pm42-side-brand strong{
  display:block;
  margin:0 0 32px;
  font-family:"Cormorant Garamond",serif;
  font-size:40px;
  line-height:.95;
  font-weight:600;
  letter-spacing:-.04em;
}
.pm42-side-nav{ display:grid; gap:14px; }
.pm42-side-nav a{
  color:rgba(35,29,24,.74);
  padding-bottom:8px;
  border-bottom:1px solid rgba(35,29,24,.10);
}
.pm42-side-nav a:hover{ color:#231d18; }
.pm42-content{
  padding:46px clamp(26px,4vw,74px) 82px;
}
.pm42-hero,
.pm42-about,
.pm42-contact{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(370px,.92fr);
  gap:44px;
  align-items:center;
}
.pm42-copy h2,
.pm42-about-copy h3,
.pm42-option-copy h3,
.pm42-section-head h3,
.pm42-contact-copy h3{
  margin:12px 0 18px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(40px,4.2vw,70px);
  font-weight:600;
  line-height:.95;
  letter-spacing:-.04em;
}
.pm42-copy p,
.pm42-about-copy p,
.pm42-option-copy p,
.pm42-section-head p,
.pm42-service-grid p,
.pm42-contact-copy p,
.pm42-form label span,
.pm42-form-footer p{
  font-size:15px;
  line-height:1.9;
}
.pm42-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:24px;
}
.pm42-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 22px;
  border-radius:999px;
  border:1px solid rgba(35,29,24,.18);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#231d18;
}
.pm42-btn-primary{ background:#2f5c53; border-color:#2f5c53; color:#fbf7f1; }
.pm42-hero{ padding:10px 0 58px; scroll-margin-top:120px; }
.pm42-hero-media,
.pm42-side-image{ margin:0; }
.pm42-hero-media{
  width:min(100%, 520px);
  justify-self:end;
}
.pm42-hero-media img{
  width:100%;
  height:760px;
  display:block;
  object-fit:cover;
  object-position:left center;
}
.pm42-about{
  padding:60px 0 56px;
  border-top:1px solid rgba(35,29,24,.09);
  scroll-margin-top:120px;
}
.pm42-side-image img{
  width:100%;
  height:auto;
  display:block;
}
.pm42-side-image.right-image{ justify-self:end; width:min(100%, 620px); }
.pm42-services,
.pm42-options,
.pm42-contact{
  padding:60px 0 16px;
  border-top:1px solid rgba(35,29,24,.09);
  scroll-margin-top:120px;
}
.pm42-section-head{ max-width:740px; margin-bottom:28px; }
.pm42-service-panel{
  background:#ffffff;
  border:1px solid rgba(35,29,24,.08);
  padding:28px;
}
.pm42-service-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:26px 34px;
}
.pm42-service-grid article{
  padding:0 0 18px;
  border-bottom:1px solid rgba(35,29,24,.11);
}
.pm42-service-grid h4{
  margin:0 0 10px;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:18px;
  line-height:1.35;
  letter-spacing:-.02em;
}
.pm42-options{
  display:grid;
  grid-template-columns:minmax(360px,.98fr) minmax(0,.82fr);
  gap:48px;
  align-items:center;
}
.pm42-side-image.left-image{ width:min(100%, 640px); justify-self:start; }
.pm42-contact{
  align-items:start;
  padding-bottom:76px;
}
.pm42-form{
  background:rgba(255,255,255,.54);
  border:1px solid rgba(35,29,24,.10);
  padding:28px;
}
.pm42-form-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.pm42-form label{ display:block; }
.pm42-form label span{
  display:block;
  margin-bottom:8px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.pm42-form input,
.pm42-form select,
.pm42-form textarea{
  width:100%;
  border:1px solid rgba(35,29,24,.14);
  background:rgba(255,255,255,.82);
  color:#231d18;
  font:inherit;
  padding:14px 16px;
  outline:none;
}
.pm42-form textarea{ resize:vertical; min-height:180px; }
.pm42-full{ display:block; margin-top:18px; }
.pm42-form-footer{
  display:flex;
  gap:20px;
  justify-content:space-between;
  align-items:center;
  margin-top:22px;
}
.pm42-form-footer p{ margin:0; max-width:500px; color:rgba(35,29,24,.70); }
.pm42-form-footer button{
  min-height:48px;
  padding:0 22px;
  border:0;
  background:#231d18;
  color:#fff;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
}
.pm42-next-style{
  position:fixed;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  z-index:25;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  pointer-events:none;
  color:rgba(30,27,25,.9);
}
.pm42-next-style span{
  font-family:"Cormorant Garamond",serif;
  font-size:20px;
  line-height:1.1;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  letter-spacing:.02em;
}
.pm42-next-arrow{
  width:84px;
  height:84px;
  border-radius:999px;
  border:8px solid rgba(119,119,119,.24);
  background:rgba(255,255,255,.12);
  display:grid;
  place-items:center;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:48px;
  font-weight:700;
  line-height:1;
  color:#201c18;
  box-shadow:0 12px 32px rgba(28,24,20,.18);
}
[data-scroll-reveal]{
  opacity:0;
  transform:translateY(34px);
  transition:opacity .9s ease, transform 1s cubic-bezier(.22,1,.36,1);
  will-change:transform, opacity;
}
[data-scroll-reveal].is-visible{
  opacity:1;
  transform:translateY(0);
}
@media (max-width: 1120px){
  .pm42-grid{ grid-template-columns:1fr; }
  .pm42-sidebar{ border-right:0; border-bottom:1px solid rgba(35,29,24,.10); }
  .pm42-sidebar-inner{ position:relative; top:0; }
}
@media (max-width: 980px){
  .pm42-hero,
  .pm42-about,
  .pm42-contact,
  .pm42-options,
  .pm42-service-grid,
  .pm42-form-grid{
    grid-template-columns:1fr;
  }
  .pm42-side-image.left-image,
  .pm42-side-image.right-image,
  .pm42-hero-media{ width:100%; }
  .pm42-hero-media img{ height:auto; max-height:none; }
  .pm42-form-footer{ flex-direction:column; align-items:flex-start; }
  .pm42-next-style{ right:10px; }
}
@media (max-width: 700px){
  .pm42-main{ padding-top:104px; }
  .pm42-intro{ padding-top:18px; }
  .pm42-preview-lead{ padding:60px 0 90px; }
  .pm42-content{ padding:24px 20px 56px; }
  .pm42-sidebar-inner{ padding:26px 20px 30px; }
  .pm42-service-panel, .pm42-form{ padding:20px; }
  .pm42-next-style{
    top:auto;
    bottom:22px;
    transform:none;
    flex-direction:row;
    gap:12px;
  }
  .pm42-next-style span{
    writing-mode:horizontal-tb;
    transform:none;
    font-size:15px;
  }
  .pm42-next-arrow{ width:66px; height:66px; font-size:36px; border-width:6px; }
}


/* --- v43 website-design finalization of first style --- */
.pm43-main{
  padding-top:126px;
  width:min(100%, var(--max));
  margin:auto;
}
.pm43-kicker,
.pm43-overline,
.pm43-side-nav a{
  display:block;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:10px;
}
.pm43-intro{
  padding:34px 0 0;
}
.pm43-intro h1{
  margin:10px 0 0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(56px,7vw,106px);
  line-height:.92;
  letter-spacing:-.06em;
  font-weight:600;
}
.pm43-intro-copy{
  margin:34px 0 0;
  max-width:760px;
  color:rgba(241,238,232,.72);
  font-size:15px;
  line-height:1.9;
}
.pm43-preview-wrap{
  position:relative;
  width:100vw;
  margin-left:calc(50% - 50vw);
  padding-top:168px;
  padding-bottom:88px;
}
.pm43-next-style{
  position:absolute;
  right:20px;
  top:20px;
  z-index:30;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  color:#1e1a17;
  pointer-events:none;
}
.pm43-next-style.is-fixed{
  position:fixed;
  top:50%;
  right:20px;
  transform:translateY(-50%);
}
.pm43-next-style span{
  font-family:"Cormorant Garamond",serif;
  font-size:22px;
  line-height:1.1;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  letter-spacing:.02em;
}
.pm43-next-arrow{
  width:96px;
  height:96px;
  border-radius:999px;
  border:10px solid rgba(104,104,104,.36);
  background:rgba(255,255,255,.18);
  display:grid;
  place-items:center;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:52px;
  font-weight:700;
  line-height:1;
  color:#161311;
  box-shadow:0 16px 40px rgba(28,24,20,.22);
}
.pm43-preview{
  background:linear-gradient(180deg,#f1ece4 0%,#f7f2ea 40%,#eee5d9 100%);
  color:#231d18;
  min-height:100vh;
}
.pm43-traits-bar{
  padding:26px 32px 22px 32px;
  border-bottom:1px solid rgba(35,29,24,.09);
}
.pm43-traits{
  margin:0;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(28px,3vw,42px);
  line-height:1.1;
  color:#2d2722;
  letter-spacing:-.03em;
}
.pm43-grid{
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  min-height:calc(100vh - 76px);
}
.pm43-sidebar{
  background:rgba(255,248,241,.48);
  border-right:1px solid rgba(35,29,24,.10);
}
.pm43-sidebar-inner{
  position:sticky;
  top:98px;
  padding:42px 28px 42px;
}
.pm43-side-brand strong{
  display:block;
  margin:0 0 32px;
  font-family:"Cormorant Garamond",serif;
  font-size:40px;
  line-height:.95;
  font-weight:600;
  letter-spacing:-.04em;
}
.pm43-side-nav{ display:grid; gap:14px; }
.pm43-side-nav a{
  color:rgba(35,29,24,.74);
  padding-bottom:8px;
  border-bottom:1px solid rgba(35,29,24,.10);
}
.pm43-side-nav a:hover{ color:#231d18; }
.pm43-content{
  padding:46px clamp(26px,4vw,74px) 82px;
}
.pm43-hero,
.pm43-about,
.pm43-contact{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(370px,.92fr);
  gap:44px;
  align-items:center;
}
.pm43-copy h2,
.pm43-about-copy h3,
.pm43-option-copy h3,
.pm43-section-head h3,
.pm43-contact-copy h3{
  margin:12px 0 18px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(40px,4.2vw,70px);
  font-weight:600;
  line-height:.95;
  letter-spacing:-.04em;
}
.pm43-copy p,
.pm43-about-copy p,
.pm43-option-copy p,
.pm43-section-head p,
.pm43-service-grid p,
.pm43-contact-copy p,
.pm43-form label span,
.pm43-form-footer p,
.pm43-play-note{
  font-size:15px;
  line-height:1.9;
}
.pm43-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:24px;
}
.pm43-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 22px;
  border-radius:999px;
  border:1px solid rgba(35,29,24,.18);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#231d18;
}
.pm43-btn-primary{ background:#2f5c53; border-color:#2f5c53; color:#fbf7f1; }
.pm43-play-note{
  margin:18px 0 0;
  color:#5c4b41;
  font-style:italic;
}
.pm43-hero{ padding:10px 0 58px; scroll-margin-top:120px; }
.pm43-hero-media,
.pm43-side-image{ margin:0; }
.pm43-hero-media{
  width:min(100%, 520px);
  justify-self:end;
}
.pm43-hero-media img{
  width:100%;
  height:760px;
  display:block;
  object-fit:cover;
  object-position:left center;
}
.pm43-about{
  padding:60px 0 56px;
  border-top:1px solid rgba(35,29,24,.09);
  scroll-margin-top:120px;
}
.pm43-side-image.right-image{ justify-self:end; width:min(100%, 620px); }
.pm43-side-image img{
  width:100%;
  height:auto;
  display:block;
}
.pm43-services,
.pm43-options,
.pm43-contact{
  padding:60px 0 16px;
  border-top:1px solid rgba(35,29,24,.09);
  scroll-margin-top:120px;
}
.pm43-section-head{ max-width:760px; margin-bottom:28px; }
.pm43-service-panel{
  background:#ffffff;
  border:1px solid rgba(35,29,24,.08);
  padding:28px;
}
.pm43-service-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:26px 34px;
}
.pm43-service-grid article{
  padding:0 0 18px;
  border-bottom:1px solid rgba(35,29,24,.11);
}
.pm43-service-grid h4{
  margin:0 0 10px;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:18px;
  line-height:1.35;
  letter-spacing:-.02em;
}
.pm43-options{
  display:grid;
  grid-template-columns:minmax(360px,.98fr) minmax(0,.82fr);
  gap:48px;
  align-items:center;
}
.pm43-side-image.left-image{ width:min(100%, 640px); justify-self:start; }
.pm43-contact{
  align-items:start;
  padding-bottom:76px;
}
.pm43-form{
  background:rgba(255,255,255,.54);
  border:1px solid rgba(35,29,24,.10);
  padding:28px;
}
.pm43-form-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.pm43-form label{ display:block; }
.pm43-form label span{
  display:block;
  margin-bottom:8px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.pm43-form input,
.pm43-form select,
.pm43-form textarea{
  width:100%;
  border:1px solid rgba(35,29,24,.14);
  background:rgba(255,255,255,.82);
  color:#231d18;
  font:inherit;
  padding:14px 16px;
  outline:none;
}
.pm43-form textarea{ resize:vertical; min-height:180px; }
.pm43-full{ display:block; margin-top:18px; }
.pm43-form-footer{
  display:flex;
  gap:20px;
  justify-content:space-between;
  align-items:center;
  margin-top:22px;
}
.pm43-form-footer p{ margin:0; max-width:500px; color:rgba(35,29,24,.70); }
.pm43-form-footer button{
  min-height:48px;
  padding:0 22px;
  border:0;
  background:#231d18;
  color:#fff;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
}
[data-scroll-reveal]{
  opacity:0;
  transform:translateY(34px);
  transition:opacity .9s ease, transform 1s cubic-bezier(.22,1,.36,1);
  will-change:transform, opacity;
}
[data-scroll-reveal].is-visible{
  opacity:1;
  transform:translateY(0);
}
@media (max-width: 1120px){
  .pm43-grid{ grid-template-columns:1fr; }
  .pm43-sidebar{ border-right:0; border-bottom:1px solid rgba(35,29,24,.10); }
  .pm43-sidebar-inner{ position:relative; top:0; }
}
@media (max-width: 980px){
  .pm43-hero,
  .pm43-about,
  .pm43-contact,
  .pm43-options,
  .pm43-service-grid,
  .pm43-form-grid{
    grid-template-columns:1fr;
  }
  .pm43-side-image.left-image,
  .pm43-side-image.right-image,
  .pm43-hero-media{ width:100%; }
  .pm43-hero-media img{ height:620px; }
  .pm43-form-footer{ flex-direction:column; align-items:flex-start; }
}
@media (max-width: 700px){
  .pm43-main{ padding-top:104px; }
  .pm43-intro{ padding-top:18px; }
  .pm43-preview-wrap{ padding-top:118px; }
  .pm43-traits-bar{ padding:18px 20px 18px 20px; }
  .pm43-content{ padding:24px 20px 56px; }
  .pm43-sidebar-inner{ padding:26px 20px 30px; }
  .pm43-service-panel, .pm43-form{ padding:20px; }
  .pm43-next-style{ right:10px; }
  .pm43-next-style span{
    writing-mode:horizontal-tb;
    transform:none;
    font-size:15px;
  }
  .pm43-next-arrow{ width:74px; height:74px; font-size:38px; border-width:8px; }
}


/* --- v46: second website style, added without changing the first pm43 example --- */
.pm43-next-style{
  pointer-events:auto !important;
  cursor:pointer;
  user-select:none;
  transition:color .28s ease, transform .28s ease;
}
.pm43-next-style:focus-visible{
  outline:2px solid rgba(255,255,255,.8);
  outline-offset:8px;
}
.pm43-next-style .pm43-next-arrow{
  transition:background .28s ease,border-color .28s ease,color .28s ease,transform .28s ease;
}
.pm43-next-style:hover .pm43-next-arrow{ transform:translateX(5px); }
.pm43-preview-wrap.style-craft-active .pm43-next-style{ color:#f2f2f2; }
.pm43-preview-wrap.style-craft-active .pm43-next-style .pm43-next-arrow{
  color:#fff;
  background:rgba(28,28,30,.92);
  border-color:rgba(227,58,50,.56);
  box-shadow:0 16px 42px rgba(0,0,0,.32),0 0 0 1px rgba(255,255,255,.08);
}
.pm43-preview-wrap.style-craft-active .pm43-next-style:hover .pm43-next-arrow{ transform:translateX(-5px); }

.pm44-style-stage{
  position:relative;
  width:100%;
  overflow:hidden;
  transition:height .45s cubic-bezier(.22,.8,.24,1);
}
.pm44-style-slide{
  width:100%;
}
.pm44-style-slide[aria-hidden="true"]{
  display:none;
}
.pm44-style-stage.is-switching .pm44-style-slide{
  display:block !important;
  position:absolute;
  top:0;
  left:0;
  width:100%;
}

.pm44-craft{
  background:#1c1c1f;
  color:#f3f3f3;
  min-height:100vh;
  font-family:"Inter",system-ui,sans-serif;
  overflow:hidden;
}
.pm44-craft a{ color:inherit; }
.pm44-craft-traits{
  padding:26px clamp(24px,4vw,68px) 22px;
  color:#d9d9d9;
  font-family:"Inter",sans-serif;
  font-weight:600;
  font-size:clamp(20px,2.2vw,30px);
  letter-spacing:-.02em;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.pm44-craft-nav{
  position:sticky;
  top:78px;
  z-index:18;
  min-height:76px;
  padding:0 clamp(24px,4vw,68px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  background:rgba(28,28,31,.92);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.pm44-craft-brand{
  font-family:"Inter",sans-serif;
  font-size:18px;
  font-weight:800;
  letter-spacing:-.03em;
}
.pm44-craft-nav nav{
  display:flex;
  align-items:center;
  gap:clamp(15px,2vw,30px);
}
.pm44-craft-nav nav a{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:rgba(255,255,255,.78);
}
.pm44-craft-nav nav a:hover{ color:#fff; }
.pm44-craft-nav .pm44-nav-cta{
  padding:14px 18px;
  background:#e33a32;
  color:#fff;
}

.pm44-craft-hero{
  position:relative;
  min-height:clamp(620px,78vh,900px);
  display:flex;
  align-items:flex-end;
  isolation:isolate;
}
.pm44-craft-hero > img{
  position:absolute;
  inset:0;
  z-index:-3;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 43%;
}
.pm44-hero-shade{
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    linear-gradient(90deg,rgba(20,20,22,.95) 0%,rgba(20,20,22,.75) 42%,rgba(20,20,22,.24) 74%,rgba(20,20,22,.36) 100%),
    linear-gradient(0deg,rgba(20,20,22,.84) 0%,transparent 42%);
}
.pm44-hero-copy{
  width:min(900px,78%);
  padding:clamp(90px,12vw,170px) clamp(24px,5vw,82px) clamp(70px,8vw,110px);
}
.pm44-hero-copy small,
.pm44-section-heading small,
.pm44-work-copy small,
.pm44-finale-copy small{
  display:block;
  margin-bottom:18px;
  color:#ee5149;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.2em;
}
.pm44-hero-copy h2{
  margin:0;
  max-width:850px;
  font-family:"Inter",sans-serif;
  font-size:clamp(58px,7.6vw,118px);
  font-weight:800;
  line-height:.88;
  letter-spacing:-.065em;
  text-wrap:balance;
}
.pm44-hero-copy p{
  margin:30px 0 0;
  max-width:680px;
  color:rgba(255,255,255,.72);
  font-size:15px;
  line-height:1.8;
}
.pm44-red-link,
.pm44-final-cta{
  display:inline-flex;
  align-items:center;
  gap:18px;
  margin-top:34px;
  padding-bottom:8px;
  border-bottom:3px solid #e33a32;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.pm44-red-link span,
.pm44-final-cta span{ font-size:20px; transition:transform .2s ease; }
.pm44-red-link:hover span,
.pm44-final-cta:hover span{ transform:translateX(6px); }

.pm44-metrics{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.pm44-metric{
  min-height:310px;
  padding:56px clamp(28px,5vw,76px) 54px;
  border-right:1px solid rgba(255,255,255,.08);
}
.pm44-metric:last-child{ border-right:0; }
.pm44-metric::before{
  content:"";
  display:block;
  width:72px;
  height:6px;
  margin-bottom:28px;
  background:#e33a32;
}
.pm44-metric strong{
  display:block;
  font-size:clamp(72px,9vw,142px);
  font-weight:800;
  line-height:.8;
  letter-spacing:-.07em;
}
.pm44-metric h3{
  margin:26px 0 10px;
  font-size:16px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.pm44-metric p{
  margin:0;
  max-width:430px;
  color:rgba(255,255,255,.58);
  font-size:13px;
  line-height:1.7;
}

.pm44-craft-services,
.pm44-pricing{
  padding:clamp(90px,10vw,150px) clamp(24px,5vw,82px);
}
.pm44-section-heading{ max-width:880px; }
.pm44-section-heading.narrow{ max-width:760px; }
.pm44-section-heading h3,
.pm44-work-copy h3,
.pm44-finale-copy h3{
  margin:0;
  font-size:clamp(40px,5vw,76px);
  font-weight:800;
  line-height:.98;
  letter-spacing:-.05em;
  text-wrap:balance;
}
.pm44-service-row{
  margin-top:72px;
  border-top:1px solid rgba(255,255,255,.13);
}
.pm44-service-row article{
  display:grid;
  grid-template-columns:70px minmax(220px,.7fr) 1fr;
  gap:24px;
  align-items:start;
  padding:34px 0;
  border-bottom:1px solid rgba(255,255,255,.13);
}
.pm44-service-row article > span{
  color:#e33a32;
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
}
.pm44-service-row h4{
  margin:0;
  font-size:25px;
  line-height:1.1;
  letter-spacing:-.03em;
}
.pm44-service-row p{
  margin:0;
  max-width:620px;
  color:rgba(255,255,255,.58);
  font-size:14px;
  line-height:1.75;
}

.pm44-craft-work{
  display:grid;
  grid-template-columns:minmax(360px,.95fr) minmax(0,1fr);
  min-height:760px;
  background:#242427;
  border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.pm44-work-image{ margin:0; min-height:760px; }
.pm44-work-image img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.pm44-work-copy{
  align-self:center;
  padding:80px clamp(36px,6vw,96px);
}
.pm44-work-copy p,
.pm44-finale-copy p{
  margin:28px 0 0;
  max-width:620px;
  color:rgba(255,255,255,.62);
  font-size:15px;
  line-height:1.8;
}
.pm44-work-points{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:36px;
}
.pm44-work-points span{
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.13);
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.pm44-pricing{ background:#19191c; }
.pm44-price-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:60px;
}
.pm44-price-grid article{
  min-height:390px;
  padding:34px 30px;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.10);
  background:#222225;
  transition:transform .25s ease,border-color .25s ease;
}
.pm44-price-grid article:hover{ transform:translateY(-6px); border-color:rgba(227,58,50,.72); }
.pm44-price-grid article.featured{ border-color:#e33a32; }
.pm44-price-grid small{
  color:#e33a32;
  font-size:9px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.pm44-price-grid h4{
  margin:24px 0 10px;
  font-size:28px;
  letter-spacing:-.04em;
}
.pm44-price-grid strong{
  display:block;
  font-size:clamp(34px,3.5vw,52px);
  line-height:1;
  letter-spacing:-.05em;
}
.pm44-price-grid p{
  margin:28px 0 34px;
  color:rgba(255,255,255,.56);
  font-size:13px;
  line-height:1.7;
}
.pm44-price-grid a{
  margin-top:auto;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.10);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.pm44-price-grid a:hover{ color:#ee5149; }

.pm44-craft-finale{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(380px,.85fr);
  min-height:720px;
  background:#242427;
}
.pm44-finale-copy{
  align-self:center;
  padding:80px clamp(28px,6vw,100px);
}
.pm44-finale-image{ margin:0; min-height:720px; }
.pm44-finale-image img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }

[data-craft-reveal]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .72s ease,transform .82s cubic-bezier(.22,1,.36,1);
}
[data-craft-reveal].is-visible{ opacity:1; transform:translateY(0); }

@media(max-width:980px){
  .pm44-craft-nav{ top:68px; }
  .pm44-craft-nav nav a:not(.pm44-nav-cta){ display:none; }
  .pm44-hero-copy{ width:100%; }
  .pm44-metrics{ grid-template-columns:1fr; }
  .pm44-metric{ border-right:0; border-bottom:1px solid rgba(255,255,255,.08); }
  .pm44-service-row article{ grid-template-columns:48px 1fr; }
  .pm44-service-row p{ grid-column:2; }
  .pm44-craft-work,
  .pm44-craft-finale{ grid-template-columns:1fr; }
  .pm44-work-image{ min-height:560px; }
  .pm44-finale-image{ min-height:560px; }
  .pm44-price-grid{ grid-template-columns:1fr; }
}
@media(max-width:700px){
  .pm44-craft-traits{ padding:18px 20px; }
  .pm44-craft-nav{ padding:0 20px; min-height:68px; top:62px; }
  .pm44-craft-brand{ font-size:15px; }
  .pm44-craft-nav .pm44-nav-cta{ padding:11px 12px; font-size:9px; }
  .pm44-craft-hero{ min-height:680px; }
  .pm44-hero-copy{ padding:100px 20px 60px; }
  .pm44-hero-copy h2{ font-size:clamp(50px,16vw,76px); }
  .pm44-craft-services,
  .pm44-pricing{ padding:86px 20px; }
  .pm44-metric{ padding:48px 20px; min-height:250px; }
  .pm44-service-row{ margin-top:50px; }
  .pm44-service-row article{ grid-template-columns:36px 1fr; padding:26px 0; }
  .pm44-service-row h4{ font-size:21px; }
  .pm44-work-image,
  .pm44-finale-image{ min-height:500px; }
  .pm44-work-copy,
  .pm44-finale-copy{ padding:70px 20px; }
}


/* =========================================================
   v47 — Webdesign carousel polish
   ========================================================= */

/* More breathing room between the Noirin intro and the first live example. */
.pm43-preview-wrap{
  padding-top:320px !important;
}

/* Style descriptors belong to Noirin, not to the showcased website itself. */
.pm47-style-traits{
  position:relative;
  z-index:4;
  margin:0;
  padding:0 var(--pad) 20px;
  background:transparent !important;
  border:0 !important;
  color:#f1dfc9;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(28px,3vw,43px);
  font-weight:500;
  line-height:1;
  letter-spacing:-.025em;
  text-shadow:0 0 24px rgba(241,223,201,.10);
  transition:color .36s ease,font-family .36s ease,letter-spacing .36s ease;
}
.pm43-preview-wrap.style-craft-active .pm47-style-traits{
  color:#ff655c;
  font-family:"Inter",sans-serif;
  font-size:clamp(20px,2.15vw,30px);
  font-weight:700;
  letter-spacing:-.02em;
  text-shadow:0 0 24px rgba(227,58,50,.12);
}

/* The old in-example trait surfaces are intentionally suppressed. */
.pm43-traits-bar,
.pm44-craft-traits{
  display:none !important;
}

/* Sticky menus broke because the slide stage permanently clipped overflow.
   Clip only during the horizontal page transition. */
.pm44-style-stage{
  overflow:visible !important;
}
.pm44-style-stage.is-switching{
  overflow:hidden !important;
}
.pm44-craft{
  overflow:visible !important;
}
.pm43-sidebar-inner{
  position:sticky !important;
  top:98px !important;
}

/* The style arrow starts INSIDE the example and can only become fixed
   after its full control fits inside the website area. JS sets --pm47-arrow-top. */
.pm43-next-style{
  top:var(--pm47-arrow-top,360px) !important;
  transition:color .28s ease !important;
}
.pm43-next-style.is-fixed{
  top:50% !important;
  transform:translateY(-50%) !important;
}
.pm43-next-style.pm47-bottom-lock{
  position:absolute !important;
  top:var(--pm47-arrow-bottom,auto) !important;
  transform:none !important;
}

/* Occasional, restrained attention cue after the visitor has spent time
   scrolling through a website example. */
.pm43-next-style.pm47-attention .pm43-next-arrow{
  animation:pm47ArrowNudge .82s cubic-bezier(.22,.8,.24,1) both;
}
@keyframes pm47ArrowNudge{
  0%,100%{transform:translateX(0)}
  24%{transform:translateX(14px)}
  48%{transform:translateX(0)}
  68%{transform:translateX(8px)}
  86%{transform:translateX(0)}
}
@media (prefers-reduced-motion:reduce){
  .pm43-next-style.pm47-attention .pm43-next-arrow{animation:none !important;}
}

@media(max-width:1120px){
  /* Sticky sidebar becomes a normal horizontal/top section at the existing breakpoint. */
  .pm43-sidebar-inner{position:relative !important;top:0 !important;}
}
@media(max-width:700px){
  .pm43-preview-wrap{padding-top:190px !important;}
  .pm47-style-traits{
    padding:0 20px 16px;
    font-size:clamp(25px,8vw,34px);
  }
  .pm43-preview-wrap.style-craft-active .pm47-style-traits{
    font-size:clamp(18px,5.8vw,24px);
  }
}


/* =========================================================
   v48 — Webdesign carousel navigation + clean replay
   ========================================================= */

/* Both controls are bounded to the actual website example.
   JS supplies the exact top/bottom lock positions. */
.pm48-style-arrow{
  position:absolute;
  top:var(--pm48-arrow-top,360px);
  z-index:32;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  user-select:none;
  color:#1d1a17;
  -webkit-tap-highlight-color:transparent;
}
.pm48-style-arrow--next{ right:20px; }
.pm48-style-arrow--prev{
  left:20px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.pm48-style-arrow.is-fixed{
  position:fixed;
  top:50%;
  transform:translateY(-50%);
}
.pm48-style-arrow.pm48-bottom-lock{
  position:absolute;
  top:var(--pm48-arrow-bottom,auto);
  transform:none;
}

.pm48-arrow-content{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  transition:transform .24s ease;
}
.pm48-arrow-label{
  display:block;
  writing-mode:horizontal-tb;
  transform:none;
  white-space:nowrap;
  font-family:"Cormorant Garamond",serif;
  font-size:21px;
  font-weight:600;
  line-height:1;
  letter-spacing:-.01em;
  color:inherit;
  text-align:center;
}
.pm48-arrow-circle{
  width:98px;
  height:98px;
  border-radius:999px;
  border:10px solid rgba(16,15,14,.70);
  background:rgba(255,255,255,.22);
  display:grid;
  place-items:center;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:52px;
  font-weight:700;
  line-height:1;
  color:#151311;
  box-shadow:
    0 0 0 3px rgba(22,20,18,.15),
    0 16px 40px rgba(28,24,20,.22);
  transition:
    background .25s ease,
    border-color .25s ease,
    color .25s ease,
    box-shadow .25s ease;
}

/* First style: darker, clearer ring. */
.pm43-preview-wrap:not(.style-craft-active) .pm48-style-arrow--next .pm48-arrow-circle{
  border-color:rgba(10,10,9,.76);
  box-shadow:
    0 0 0 3px rgba(0,0,0,.18),
    0 14px 36px rgba(24,21,18,.24);
}
.pm43-preview-wrap:not(.style-craft-active) .pm48-style-arrow--next .pm48-arrow-label{
  color:#211d19;
}

/* Craft style: both arrows adopt the red/charcoal language. */
.pm43-preview-wrap.style-craft-active .pm48-style-arrow{
  color:#f3f3f3;
}
.pm43-preview-wrap.style-craft-active .pm48-arrow-label{
  font-family:"Inter",sans-serif;
  font-size:15px;
  font-weight:700;
  letter-spacing:.02em;
}
.pm43-preview-wrap.style-craft-active .pm48-arrow-circle{
  color:#fff;
  background:rgba(26,26,29,.96);
  border-color:rgba(227,58,50,.68);
  box-shadow:
    0 0 0 3px rgba(227,58,50,.14),
    0 16px 42px rgba(0,0,0,.34);
}

.pm48-style-arrow--next:hover .pm48-arrow-content{ transform:translateX(5px); }
.pm48-style-arrow--prev:hover .pm48-arrow-content{ transform:translateX(-5px); }
.pm48-style-arrow:focus-visible{
  outline:2px solid rgba(255,255,255,.82);
  outline-offset:8px;
}

/* Attention cue moves label + arrow together. */
.pm48-style-arrow--next.pm48-attention .pm48-arrow-content{
  animation:pm48ArrowNudge .86s cubic-bezier(.22,.8,.24,1) both;
}
@keyframes pm48ArrowNudge{
  0%,100%{transform:translateX(0)}
  22%{transform:translateX(16px)}
  46%{transform:translateX(0)}
  66%{transform:translateX(10px)}
  86%{transform:translateX(0)}
}

/* Style traits stay outside the examples, but are included in the
   scroll-to-top target so they remain visible after every switch. */
.pm47-style-traits{
  scroll-margin-top:100px;
}

@media (prefers-reduced-motion:reduce){
  .pm48-style-arrow--next.pm48-attention .pm48-arrow-content{
    animation:none !important;
  }
}
@media(max-width:700px){
  .pm48-style-arrow--next{right:10px}
  .pm48-style-arrow--prev{left:10px}
  .pm48-arrow-circle{
    width:74px;
    height:74px;
    border-width:8px;
    font-size:38px;
  }
  .pm48-arrow-label{font-size:15px}
  .pm43-preview-wrap.style-craft-active .pm48-arrow-label{font-size:12px}
}


/* =========================================================
   v49 — Third style: professional office / trust / structure
   ========================================================= */
.pm43-preview-wrap.style-office-active .pm47-style-traits{
  color:#d7e4ff;
  font-family:"Inter",sans-serif;
  font-size:clamp(20px,2.15vw,30px);
  font-weight:700;
  letter-spacing:-.02em;
  text-shadow:0 0 24px rgba(53,93,170,.12);
}
.pm43-preview-wrap.style-office-active .pm48-style-arrow{
  color:#edf3ff;
}
.pm43-preview-wrap.style-office-active .pm48-arrow-label{
  font-family:"Inter",sans-serif;
  font-size:15px;
  font-weight:700;
  letter-spacing:.02em;
}
.pm43-preview-wrap.style-office-active .pm48-arrow-circle{
  color:#fff;
  background:rgba(18,33,57,.94);
  border-color:rgba(113,138,184,.58);
  box-shadow:0 0 0 3px rgba(85,116,171,.14),0 18px 44px rgba(10,18,31,.30);
}

.pm49-office{
  background:#f3f6fb;
  color:#172032;
  min-height:100vh;
  font-family:"Inter",system-ui,sans-serif;
  overflow:visible !important;
}
.pm49-office a{ color:inherit; }
.pm49-office-nav{
  position:sticky;
  top:78px;
  z-index:18;
  min-height:78px;
  padding:0 clamp(24px,4.5vw,74px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  background:rgba(243,246,251,.94);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(23,32,50,.08);
}
.pm49-office-brand{
  font-size:18px;
  font-weight:800;
  letter-spacing:-.03em;
}
.pm49-office-nav nav{
  display:flex;
  align-items:center;
  gap:clamp(15px,2vw,28px);
}
.pm49-office-nav nav a{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:rgba(23,32,50,.62);
}
.pm49-office-nav nav a:hover{ color:#172032; }
.pm49-nav-cta{
  padding:14px 18px;
  border:1px solid rgba(23,32,50,.14);
  background:#17294a;
  color:#fff !important;
}

.pm49-office-hero{
  position:relative;
  min-height:clamp(650px,82vh,920px);
  display:flex;
  align-items:flex-end;
  isolation:isolate;
}
.pm49-office-hero > img{
  position:absolute;
  inset:0;
  z-index:-3;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 38%;
}
.pm49-office-veil{
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    linear-gradient(90deg,rgba(16,31,55,.86) 0%,rgba(16,31,55,.72) 46%,rgba(16,31,55,.36) 74%,rgba(16,31,55,.22) 100%),
    linear-gradient(0deg,rgba(16,31,55,.80) 0%,rgba(16,31,55,.18) 56%,rgba(16,31,55,.22) 100%);
}
.pm49-office-copy{
  width:min(880px,76%);
  padding:clamp(92px,12vw,176px) clamp(24px,5vw,82px) clamp(76px,8vw,116px);
  color:#fff;
}
.pm49-office-copy small,
.pm49-office-text small,
.pm49-office-skyline-card small,
.pm49-values-copy small,
.pm49-finale-copy small{
  display:block;
  margin-bottom:18px;
  color:#bfd1fa;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.2em;
}
.pm49-office-copy h2{
  margin:0;
  max-width:860px;
  font-size:clamp(56px,7.4vw,110px);
  font-weight:800;
  line-height:.9;
  letter-spacing:-.065em;
  text-wrap:balance;
}
.pm49-office-copy p{
  margin:28px 0 0;
  max-width:640px;
  color:rgba(255,255,255,.76);
  font-size:15px;
  line-height:1.85;
}
.pm49-office-link{
  display:inline-flex;
  align-items:center;
  gap:18px;
  margin-top:34px;
  padding-bottom:8px;
  border-bottom:2px solid rgba(191,209,250,.9);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.pm49-office-link span{ font-size:20px; transition:transform .2s ease; }
.pm49-office-link:hover span{ transform:translateX(6px); }

.pm49-office-trust{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  padding:28px clamp(24px,5vw,82px) 0;
  margin-top:-72px;
  position:relative;
  z-index:3;
}
.pm49-office-trust article{
  min-height:190px;
  padding:30px 26px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(23,32,50,.08);
  box-shadow:0 22px 40px rgba(20,33,53,.08);
  backdrop-filter:blur(10px);
}
.pm49-office-trust strong{
  display:block;
  margin-bottom:18px;
  font-size:28px;
  font-weight:700;
  letter-spacing:-.04em;
}
.pm49-office-trust p{
  margin:0;
  color:rgba(23,32,50,.72);
  font-size:14px;
  line-height:1.75;
}

.pm49-office-presence,
.pm49-office-values,
.pm49-office-finale{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(360px,.92fr);
  gap:0;
  align-items:stretch;
}
.pm49-office-presence{
  padding:clamp(90px,10vw,140px) clamp(24px,5vw,82px) 0;
  grid-template-columns:minmax(0,.95fr) minmax(340px,.9fr);
  gap:36px;
}
.pm49-office-text{
  align-self:center;
  max-width:650px;
}
.pm49-office-text h3,
.pm49-office-skyline-card h3,
.pm49-values-copy h3,
.pm49-finale-copy h3{
  margin:0;
  font-size:clamp(38px,4.8vw,70px);
  font-weight:800;
  line-height:1;
  letter-spacing:-.05em;
  text-wrap:balance;
}
.pm49-office-text p,
.pm49-office-skyline-card p,
.pm49-values-copy p,
.pm49-finale-copy p{
  margin:26px 0 0;
  color:rgba(23,32,50,.72);
  font-size:15px;
  line-height:1.85;
}
.pm49-office-image,
.pm49-values-image,
.pm49-finale-image{ margin:0; }
.pm49-office-image img,
.pm49-values-image img,
.pm49-finale-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.pm49-office-image img{
  min-height:540px;
  border-radius:0 0 0 34px;
}
.pm49-office-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:36px;
}
.pm49-office-tags span{
  padding:10px 12px;
  border:1px solid rgba(23,32,50,.12);
  background:#fff;
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.pm49-office-skyline{
  position:relative;
  min-height:700px;
  margin-top:clamp(90px,10vw,140px);
  display:flex;
  align-items:center;
}
.pm49-office-skyline > img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.pm49-office-skyline-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(13,27,46,.84) 0%,rgba(13,27,46,.50) 40%,rgba(13,27,46,.20) 100%);
}
.pm49-office-skyline-card{
  position:relative;
  z-index:2;
  margin-left:clamp(24px,5vw,82px);
  width:min(620px,calc(100% - 48px));
  padding:42px clamp(24px,3.5vw,42px);
  background:rgba(255,255,255,.90);
  border:1px solid rgba(23,32,50,.08);
  box-shadow:0 30px 60px rgba(9,18,33,.14);
}
.pm49-office-skyline-card small{ color:#5c79b2; }

.pm49-office-values{
  min-height:760px;
  margin-top:clamp(90px,10vw,140px);
  background:#ffffff;
  border-top:1px solid rgba(23,32,50,.08);
  border-bottom:1px solid rgba(23,32,50,.08);
}
.pm49-values-image img{ min-height:760px; object-position:center; }
.pm49-values-copy,
.pm49-finale-copy{
  align-self:center;
  padding:80px clamp(34px,6vw,96px);
}
.pm49-values-copy ul{
  margin:34px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:14px;
}
.pm49-values-copy li{
  position:relative;
  padding-left:22px;
  color:rgba(23,32,50,.72);
  font-size:14px;
  line-height:1.7;
}
.pm49-values-copy li::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:9px;
  height:9px;
  border-radius:999px;
  background:#2d4b7d;
}

.pm49-office-finale{
  min-height:720px;
  background:#eef3fb;
}
.pm49-finale-image img{
  min-height:720px;
  object-position:center;
}

[data-office-reveal]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .72s ease,transform .82s cubic-bezier(.22,1,.36,1);
}
[data-office-reveal].is-visible{ opacity:1; transform:translateY(0); }

@media(max-width:980px){
  .pm49-office-nav{ top:68px; }
  .pm49-office-nav nav a:not(.pm49-nav-cta){ display:none; }
  .pm49-office-copy{ width:100%; }
  .pm49-office-trust{ grid-template-columns:1fr; margin-top:0; padding-top:34px; }
  .pm49-office-presence,
  .pm49-office-values,
  .pm49-office-finale{ grid-template-columns:1fr; }
  .pm49-office-skyline{ min-height:620px; }
  .pm49-values-image img,
  .pm49-finale-image img{ min-height:520px; }
}
@media(max-width:700px){
  .pm49-office-nav{ padding:0 20px; min-height:68px; top:62px; }
  .pm49-office-brand{ font-size:15px; }
  .pm49-nav-cta{ padding:11px 12px; font-size:9px; }
  .pm49-office-hero{ min-height:660px; }
  .pm49-office-copy{ padding:100px 20px 60px; }
  .pm49-office-copy h2{ font-size:clamp(48px,15.5vw,72px); }
  .pm49-office-trust{ padding:28px 20px 0; }
  .pm49-office-trust article{ min-height:0; }
  .pm49-office-presence{ padding:86px 20px 0; gap:24px; }
  .pm49-office-image img{ min-height:420px; border-radius:0 0 0 22px; }
  .pm49-office-skyline{ margin-top:86px; min-height:560px; }
  .pm49-office-skyline-card{ margin:0 20px; width:auto; padding:28px 22px; }
  .pm49-values-copy,
  .pm49-finale-copy{ padding:70px 20px; }
}


/* =========================================================
   v50 — office hero switched to skyline / navy layout
   ========================================================= */
.pm49-office{
  background:#f4f7fb;
}
.pm49-office-nav{
  top:78px;
  background:#103b69;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.pm49-office-brand,
.pm49-office-nav nav a{
  color:rgba(255,255,255,.92);
}
.pm49-office-nav nav a:hover{ color:#ffffff; }
.pm49-nav-cta{
  background:#f3f4f6;
  color:#12345d !important;
  border-color:rgba(255,255,255,.22);
}

.pm49-office-hero{
  min-height:clamp(700px,86vh,980px);
  align-items:stretch;
}
.pm49-office-hero > img{
  object-position:center;
}
.pm49-office-veil{
  background:
    linear-gradient(90deg,rgba(11,50,92,.92) 0%,rgba(11,50,92,.88) 36%,rgba(11,50,92,.70) 62%,rgba(11,50,92,.56) 100%),
    linear-gradient(180deg,rgba(11,50,92,.20) 0%,rgba(11,50,92,.12) 35%,rgba(11,50,92,.42) 100%);
}
.pm49-office-hero-layout{
  position:relative;
  z-index:2;
  width:100%;
  min-height:inherit;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,420px);
  gap:clamp(24px,4vw,52px);
  align-items:end;
  padding:clamp(110px,10vw,150px) clamp(24px,5vw,82px) clamp(78px,8vw,112px);
}
.pm49-office-copy{
  width:100%;
  max-width:760px;
  padding:0;
}
.pm49-office-copy h2{
  max-width:720px;
}
.pm49-office-copy p{
  max-width:650px;
}
.pm49-office-hero-card{
  align-self:end;
  display:grid;
  grid-template-columns:70px 1fr;
  gap:18px;
  align-items:start;
  margin-bottom:8px;
  padding:30px 28px;
  background:rgba(255,255,255,.96);
  color:#172032;
  border:1px solid rgba(23,32,50,.10);
  box-shadow:0 26px 54px rgba(9,18,33,.20);
}
.pm49-office-card-icon{
  width:70px;
  height:70px;
  display:grid;
  place-items:center;
  background:#103b69;
  color:#fff;
  font-size:26px;
  font-weight:800;
}
.pm49-office-hero-card strong{
  display:block;
  margin-bottom:10px;
  font-size:15px;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.pm49-office-hero-card p{
  margin:0;
  color:rgba(23,32,50,.74);
  font-size:14px;
  line-height:1.75;
}
.pm49-office-trust{
  margin-top:0;
  padding:30px clamp(24px,5vw,82px) 0;
}
.pm49-office-trust article{
  min-height:0;
}
.pm49-office-copy small,
.pm49-office-text small,
.pm49-office-skyline-card small,
.pm49-values-copy small,
.pm49-finale-copy small{
  color:#9ec0f1;
}
.pm49-office-text small,
.pm49-office-skyline-card small,
.pm49-values-copy small,
.pm49-finale-copy small{
  color:#5c79b2;
}

@media(max-width:980px){
  .pm49-office-nav{
    top:68px;
  }
  .pm49-office-hero-layout{
    grid-template-columns:1fr;
    align-items:end;
    padding:104px 24px 66px;
  }
  .pm49-office-hero-card{
    max-width:540px;
  }
}
@media(max-width:700px){
  .pm49-office-nav{
    top:62px;
    background:#103b69;
  }
  .pm49-office-hero{
    min-height:720px;
  }
  .pm49-office-hero-layout{
    padding:98px 20px 54px;
    gap:22px;
  }
  .pm49-office-copy h2{
    font-size:clamp(44px,15vw,68px);
  }
  .pm49-office-hero-card{
    grid-template-columns:54px 1fr;
    padding:24px 20px;
  }
  .pm49-office-card-icon{
    width:54px;
    height:54px;
    font-size:22px;
  }
}


/* =========================================================
   v51 — office refinement + carousel stability
   ========================================================= */

/* Only the two slides involved in a transition may render. */
.pm44-style-stage.is-switching .pm44-style-slide[aria-hidden="true"]{
  display:none !important;
  visibility:hidden !important;
}

/* Circular carousel: back is available on every style, including style 01. */
.pm48-style-arrow--prev{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}

/* Keep the first style's previous control readable against the warm background. */
.pm43-preview-wrap:not(.style-craft-active):not(.style-office-active) .pm48-style-arrow--prev{
  color:#211d19;
}
.pm43-preview-wrap:not(.style-craft-active):not(.style-office-active) .pm48-style-arrow--prev .pm48-arrow-circle{
  border-color:rgba(10,10,9,.76);
  background:rgba(255,255,255,.22);
  color:#151311;
  box-shadow:0 0 0 3px rgba(0,0,0,.18),0 14px 36px rgba(24,21,18,.24);
}

/* OFFICE / BUSINESS STYLE */
.pm49-office{
  background:#f5f7fa;
  color:#172032;
  font-family:"Inter",system-ui,sans-serif;
  overflow:clip;
}

/* The sticky office bar must never reveal a strip of the page above it. */
.pm49-office-nav{
  top:78px !important;
  min-height:74px;
  background:#0d3b67 !important;
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow:0 -96px 0 #0d3b67;
}
.pm49-office-nav::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:100%;
  height:96px;
  background:#0d3b67;
  pointer-events:none;
  z-index:-1;
}
.pm49-office-brand,
.pm49-office-nav nav a{
  color:rgba(255,255,255,.93) !important;
}
.pm49-office-nav nav a:hover{ color:#fff !important; }
.pm49-nav-cta{
  background:#f3a51f !important;
  color:#102e4d !important;
  border-color:#f3a51f !important;
  font-weight:800 !important;
}

.pm49-office-hero{
  min-height:clamp(650px,80vh,840px) !important;
  isolation:isolate;
}
.pm49-office-hero > img{
  object-position:center 47% !important;
}
.pm49-office-veil{
  background:
    linear-gradient(90deg,rgba(9,49,87,.93) 0%,rgba(9,49,87,.88) 42%,rgba(9,49,87,.68) 70%,rgba(9,49,87,.56) 100%),
    linear-gradient(0deg,rgba(5,35,63,.62) 0%,rgba(5,35,63,.14) 62%,rgba(5,35,63,.20) 100%) !important;
}
.pm49-office-hero-layout{
  align-items:end !important;
  grid-template-columns:minmax(0,1.12fr) minmax(270px,390px) !important;
  gap:clamp(34px,5vw,78px) !important;
  padding:clamp(116px,12vw,160px) clamp(28px,7vw,118px) clamp(72px,8vw,104px) !important;
}
.pm49-office-copy{
  max-width:720px !important;
}
.pm49-office-copy small{
  color:#f3a51f !important;
  font-size:11px !important;
  letter-spacing:.16em !important;
  font-weight:700 !important;
  margin-bottom:20px !important;
}
.pm49-office-copy h2{
  margin:0 !important;
  max-width:680px !important;
  font-family:"Bricolage Grotesque",sans-serif !important;
  font-size:clamp(42px,4.7vw,68px) !important;
  font-weight:600 !important;
  line-height:1.05 !important;
  letter-spacing:-.035em !important;
  text-wrap:balance;
}
.pm49-office-copy p{
  margin:26px 0 0 !important;
  max-width:620px !important;
  color:rgba(255,255,255,.80) !important;
  font-size:15px !important;
  line-height:1.8 !important;
}
.pm51-office-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:22px;
  margin-top:34px;
}
.pm51-office-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  min-height:58px;
  padding:0 26px;
  background:#f3a51f;
  color:#102e4d !important;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:13px;
  font-weight:700;
  letter-spacing:.01em;
  box-shadow:0 12px 26px rgba(0,0,0,.12);
  transition:transform .22s ease,background .22s ease;
}
.pm51-office-primary:hover{ transform:translateY(-2px); background:#ffb12d; }
.pm51-office-primary span{ font-size:18px; }
.pm51-office-secondary{
  color:#fff !important;
  font-size:12px;
  font-weight:700;
  border-bottom:1px solid rgba(255,255,255,.55);
  padding-bottom:6px;
}

.pm49-office-hero-card{
  position:relative;
  display:block !important;
  margin:0 0 4px !important;
  padding:28px 28px 26px !important;
  background:rgba(255,255,255,.95) !important;
  border:0 !important;
  color:#172032 !important;
  box-shadow:0 24px 52px rgba(5,20,39,.18) !important;
}
.pm49-office-card-accent{
  width:52px;
  height:5px;
  margin-bottom:22px;
  background:#f3a51f;
}
.pm49-office-hero-card strong{
  display:block;
  margin:0 0 12px !important;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:22px !important;
  font-weight:600 !important;
  line-height:1.16;
  letter-spacing:-.025em !important;
  text-transform:none !important;
}
.pm49-office-hero-card p{
  margin:0 !important;
  color:rgba(23,32,50,.68) !important;
  font-size:13px !important;
  line-height:1.7 !important;
}

/* Removed: the three floating trust cards and duplicate skyline block. */
.pm49-office-trust,
.pm49-office-skyline{
  display:none !important;
}

.pm49-office-presence{
  padding:clamp(100px,10vw,150px) clamp(28px,7vw,118px) 0 !important;
  gap:clamp(34px,5vw,72px) !important;
}
.pm49-office-text h3,
.pm49-values-copy h3,
.pm51-office-contact-intro h3{
  font-family:"Bricolage Grotesque",sans-serif !important;
  font-weight:600 !important;
  letter-spacing:-.035em !important;
  line-height:1.08 !important;
}
.pm49-office-text h3,
.pm49-values-copy h3{
  font-size:clamp(34px,4vw,56px) !important;
}
.pm49-office-text small,
.pm49-values-copy small,
.pm51-office-contact-intro small{
  color:#d68d13 !important;
  font-size:10px !important;
  font-weight:800 !important;
  letter-spacing:.18em !important;
}
.pm49-office-image img{
  min-height:520px !important;
  border-radius:0 !important;
}
.pm49-office-tags span{
  background:transparent !important;
  border:1px solid rgba(23,32,50,.14) !important;
  color:#20334d;
}

.pm49-office-values{
  min-height:680px !important;
  margin-top:clamp(100px,10vw,150px) !important;
  background:#fff !important;
}
.pm49-values-image img{ min-height:680px !important; }
.pm49-values-copy{
  padding:72px clamp(34px,6vw,88px) !important;
}
.pm49-values-copy li::before{ background:#f3a51f !important; }

/* Professional contact ending */
.pm51-office-contact{
  display:grid;
  grid-template-columns:minmax(300px,.8fr) minmax(420px,1.1fr);
  gap:clamp(42px,6vw,92px);
  align-items:start;
  padding:clamp(100px,10vw,150px) clamp(28px,7vw,118px) clamp(110px,11vw,160px);
  background:#eaf0f6;
  border-top:1px solid rgba(13,59,103,.10);
}
.pm51-office-contact-intro{
  max-width:540px;
}
.pm51-office-contact-intro h3{
  margin:0;
  font-size:clamp(34px,3.8vw,54px);
  color:#133758;
}
.pm51-office-contact-intro p{
  margin:24px 0 0;
  color:rgba(19,55,88,.70);
  font-size:14px;
  line-height:1.8;
}
.pm51-office-contact-image{
  margin:38px 0 0;
  width:min(100%,440px);
}
.pm51-office-contact-image img{
  display:block;
  width:100%;
  height:240px;
  object-fit:cover;
  object-position:center;
}
.pm51-office-form{
  padding:34px;
  background:#fff;
  border:1px solid rgba(13,59,103,.10);
  box-shadow:0 22px 46px rgba(14,44,73,.08);
}
.pm51-office-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.pm51-office-form label{ display:block; }
.pm51-office-form label span{
  display:block;
  margin-bottom:8px;
  color:#31506d;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.pm51-office-form input,
.pm51-office-form select,
.pm51-office-form textarea{
  width:100%;
  border:1px solid rgba(13,59,103,.16);
  background:#f8fafc;
  color:#172032;
  font:inherit;
  padding:14px 15px;
  outline:none;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.pm51-office-form input:focus,
.pm51-office-form select:focus,
.pm51-office-form textarea:focus{
  border-color:#d9951d;
  box-shadow:0 0 0 3px rgba(243,165,31,.12);
}
.pm51-office-form textarea{ resize:vertical; min-height:180px; }
.pm51-office-full{ margin-top:18px; }
.pm51-office-form-footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  margin-top:22px;
}
.pm51-office-form-footer small{
  max-width:330px;
  color:rgba(23,32,50,.52);
  font-size:11px;
  line-height:1.6;
}
.pm51-office-form-footer button{
  min-height:52px;
  padding:0 22px;
  border:0;
  background:#0d3b67;
  color:#fff;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
}
.pm51-office-form-footer button span{ margin-left:12px; color:#f3a51f; }

/* Office carousel arrows remain clearly available on both sides. */
.pm43-preview-wrap.style-office-active .pm48-style-arrow--prev,
.pm43-preview-wrap.style-office-active .pm48-style-arrow--next{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
.pm43-preview-wrap.style-office-active .pm48-arrow-circle{
  background:#0d3b67 !important;
  border-color:rgba(243,165,31,.76) !important;
  box-shadow:0 0 0 3px rgba(243,165,31,.14),0 18px 44px rgba(10,18,31,.30) !important;
}
.pm43-preview-wrap.style-office-active .pm48-arrow-label{
  color:#edf3ff !important;
}

@media(max-width:980px){
  .pm49-office-nav{
    top:68px !important;
    box-shadow:0 -86px 0 #0d3b67;
  }
  .pm49-office-nav::before{ height:86px; }
  .pm49-office-hero-layout{
    grid-template-columns:1fr !important;
    padding:110px 24px 70px !important;
  }
  .pm49-office-hero-card{ max-width:520px; }
  .pm49-office-presence,
  .pm49-office-values,
  .pm51-office-contact{
    grid-template-columns:1fr !important;
  }
  .pm51-office-contact-image{ display:none; }
}
@media(max-width:700px){
  .pm49-office-nav{
    top:62px !important;
    min-height:66px;
    box-shadow:0 -80px 0 #0d3b67;
  }
  .pm49-office-nav::before{ height:80px; }
  .pm49-office-hero{ min-height:720px !important; }
  .pm49-office-hero-layout{ padding:100px 20px 56px !important; }
  .pm49-office-copy h2{ font-size:clamp(40px,12.5vw,58px) !important; }
  .pm51-office-actions{ gap:14px; }
  .pm51-office-primary{ width:100%; }
  .pm49-office-presence{ padding:84px 20px 0 !important; }
  .pm49-office-values{ margin-top:84px !important; }
  .pm49-values-copy{ padding:64px 20px !important; }
  .pm51-office-contact{ padding:84px 20px 92px !important; }
  .pm51-office-form{ padding:22px; }
  .pm51-office-form-grid{ grid-template-columns:1fr; }
  .pm51-office-form-footer{ flex-direction:column; align-items:flex-start; }
}


/* =========================================================
   v52 — STYLE 04 / ART + EDITORIAL
   ========================================================= */

.pm43-preview-wrap.style-art-active .pm47-style-traits{color:#f5ff56 !important;}
.pm43-preview-wrap.style-art-active .pm48-style-arrow{color:#fff !important;}
.pm43-preview-wrap.style-art-active .pm48-arrow-circle{
  background:#090909 !important;
  color:#f5ff56 !important;
  border-color:rgba(245,255,86,.9) !important;
  box-shadow:0 0 0 3px rgba(245,255,86,.16),0 18px 44px rgba(0,0,0,.36) !important;
}
.pm43-preview-wrap.style-art-active .pm48-arrow-label{color:#fff !important;}

.pm52-art{
  --art-black:#090909;
  --art-white:#f6f6f1;
  --art-accent:#f5ff56;
  background:var(--art-black);
  color:var(--art-white);
  font-family:"Inter",system-ui,sans-serif;
  overflow:clip;
}
.pm52-art a{color:inherit;}
.pm52-art-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 220px;
  align-items:start;
  min-height:100vh;
  background:var(--art-black);
}
.pm52-art-content{min-width:0;overflow:hidden;}

.pm52-art-nav{
  position:sticky;
  top:78px;
  min-height:calc(100vh - 78px);
  padding:38px 22px 30px;
  border-left:1px solid rgba(255,255,255,.15);
  background:rgba(7,7,7,.97);
  z-index:12;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.pm52-art-nav strong{
  display:block;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:19px;
  line-height:.96;
  letter-spacing:-.04em;
}
.pm52-art-nav nav{display:grid;gap:12px;margin:42px 0 auto;}
.pm52-art-nav a{
  display:grid;
  grid-template-columns:28px 1fr;
  align-items:center;
  gap:8px;
  padding:10px 11px;
  border:1px solid transparent;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:rgba(255,255,255,.62);
  transform:translateX(0);
  transition:transform .42s cubic-bezier(.22,1,.36,1),border-color .32s ease,color .32s ease,background .32s ease;
}
.pm52-art-nav a span{color:rgba(255,255,255,.30);font-size:9px;transition:color .32s ease;}
.pm52-art-nav a.is-active{
  transform:translateX(-15px);
  border-color:rgba(245,255,86,.72);
  color:#fff;
  background:rgba(245,255,86,.055);
}
.pm52-art-nav a.is-active span{color:var(--art-accent);}
.pm52-art-nav em{
  font-style:normal;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:8px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.34);
}

.pm52-art-hero{
  position:relative;
  min-height:clamp(760px,95vh,1040px);
  overflow:hidden;
  background:#050505;
}
.pm52-art-hero > img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center 34%;filter:contrast(1.08);
}
.pm52-art-hero-shade{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.84) 0%,rgba(0,0,0,.52) 40%,rgba(0,0,0,.08) 72%),
    linear-gradient(0deg,rgba(0,0,0,.72) 0%,transparent 52%,rgba(0,0,0,.16) 100%);
}
.pm52-art-hero-copy{
  position:relative;z-index:2;width:min(900px,78%);
  padding:clamp(120px,14vw,190px) clamp(28px,6vw,92px) 82px;
}
.pm52-art-hero-copy small,
.pm52-art-manifesto-copy > span,
.pm52-art-gallery-copy small,
.pm52-art-expression-copy small,
.pm52-art-finale > small{
  display:block;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--art-accent);
}
.pm52-art-hero-copy h2{
  margin:22px 0 0;
  max-width:900px;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:clamp(80px,11vw,176px);
  font-weight:700;line-height:.78;letter-spacing:-.075em;color:#fff;
}
.pm52-art-hero-copy p{
  margin:42px 0 0;max-width:560px;font-size:15px;line-height:1.85;color:rgba(255,255,255,.78);
}
.pm52-art-index{
  position:absolute;right:24px;bottom:18px;z-index:2;
  font-family:"Syne","Bricolage Grotesque",sans-serif;font-size:clamp(78px,9vw,136px);font-weight:700;line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.32);opacity:.68;
}

.pm52-art-manifesto{
  display:grid;grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr);
  min-height:900px;background:var(--art-white);color:#0c0c0c;
}
.pm52-art-manifesto-copy{
  display:flex;flex-direction:column;justify-content:center;
  padding:clamp(74px,9vw,136px) clamp(28px,6vw,90px);
}
.pm52-art-manifesto-copy h3,
.pm52-art-gallery-copy h3,
.pm52-art-expression-copy h3{
  margin:18px 0 0;font-family:"Bricolage Grotesque",sans-serif;font-weight:700;letter-spacing:-.065em;line-height:.88;
}
.pm52-art-manifesto-copy h3{font-size:clamp(64px,7.6vw,118px);}
.pm52-art-manifesto-copy p{
  margin:32px 0 0;max-width:440px;font-size:14px;line-height:1.8;color:rgba(12,12,12,.66);
}
.pm52-art-abstract{margin:0;min-height:900px;overflow:hidden;}
.pm52-art-abstract img{
  width:100%;height:100%;min-height:900px;object-fit:cover;object-position:center;display:block;mix-blend-mode:multiply;
}

.pm52-art-gallery{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);
  align-items:stretch;
  min-height:920px;
  background:#070707;
  overflow:hidden;
}
.pm52-art-gallery figure{margin:0;width:100%;min-width:0;min-height:920px;}
.pm52-art-gallery figure img{
  display:block;width:100%;height:100%;min-height:920px;object-fit:cover;object-position:center 52%;filter:contrast(1.05);
}
.pm52-art-gallery-copy{
  position:relative;
  right:auto;
  top:auto;
  transform:none;
  align-self:center;
  min-width:0;
  width:auto;
  padding:clamp(70px,7vw,112px) clamp(38px,5.5vw,88px);
  z-index:3;
  container-type:inline-size;
}
.pm52-art-gallery-copy h3{
  margin-top:18px;
  max-width:100%;
  font-size:clamp(52px,5.5vw,90px);
  color:#fff;
  overflow-wrap:normal;
  hyphens:auto;
  text-wrap:balance;
}
.pm52-art-gallery-copy p{
  margin:30px 0 0;max-width:420px;font-size:14px;line-height:1.8;color:rgba(255,255,255,.66);
}
@supports (container-type:inline-size){
  .pm52-art-gallery-copy h3{font-size:clamp(48px,16cqi,90px);}
}

.pm52-art-expression{
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(400px,1.1fr);
  align-items:stretch;min-height:930px;background:var(--art-white);color:#0b0b0b;
}
.pm52-art-expression-copy{align-self:center;padding:clamp(80px,9vw,140px) clamp(28px,6vw,92px);}
.pm52-art-expression-copy h3{font-size:clamp(60px,6.7vw,108px);}
.pm52-art-expression-copy p{
  margin:32px 0 0;max-width:450px;font-size:14px;line-height:1.85;color:rgba(11,11,11,.65);
}
.pm52-art-expression figure{margin:0;min-height:930px;}
.pm52-art-expression figure img{
  width:100%;height:100%;min-height:930px;object-fit:cover;object-position:center top;display:block;
}

.pm52-art-finale{
  min-height:760px;
  padding:clamp(100px,12vw,180px) clamp(28px,7vw,112px);
  display:flex;flex-direction:column;justify-content:center;
  background:linear-gradient(135deg,rgba(245,255,86,.08),transparent 42%),#080808;
}
.pm52-art-finale h3{
  margin:20px 0 0;max-width:1000px;
  font-family:"Bricolage Grotesque",sans-serif;
  font-size:clamp(74px,10vw,158px);font-weight:700;line-height:.82;letter-spacing:-.075em;color:#fff;
}
.pm52-art-finale p{
  margin:38px 0 0;max-width:480px;font-size:15px;line-height:1.8;color:rgba(255,255,255,.66);
}
.pm52-art-cta{
  align-self:flex-start;display:inline-flex;align-items:center;gap:18px;
  margin-top:44px;padding:14px 0 11px;border-bottom:2px solid var(--art-accent);
  font-family:"Syne","Bricolage Grotesque",sans-serif;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff !important;
}
.pm52-art-cta span{color:var(--art-accent);font-size:18px;}

[data-art-reveal]{
  opacity:0;transform:translateY(36px);
  transition:opacity .8s ease,transform .95s cubic-bezier(.22,1,.36,1);
  will-change:opacity,transform;
}
[data-art-reveal].is-visible{opacity:1;transform:translateY(0);}

@media(max-width:1080px){
  .pm52-art-layout{grid-template-columns:minmax(0,1fr) 180px;}
  .pm52-art-nav{top:68px;min-height:calc(100vh - 68px);}
  .pm52-art-manifesto{grid-template-columns:1fr;}
  .pm52-art-abstract,.pm52-art-abstract img{min-height:620px;}
  .pm52-art-expression{grid-template-columns:1fr;}
  .pm52-art-expression figure,.pm52-art-expression figure img{min-height:720px;}
  .pm52-art-gallery{
    grid-template-columns:1fr;
    min-height:0;
  }
  .pm52-art-gallery figure,
  .pm52-art-gallery figure img{min-height:clamp(600px,72vw,760px);}
  .pm52-art-gallery-copy{
    width:auto;
    padding:clamp(72px,9vw,104px) clamp(28px,7vw,76px) clamp(94px,11vw,132px);
  }
  .pm52-art-gallery-copy h3{font-size:clamp(64px,9vw,100px);}
}
@media(max-width:760px){
  .pm52-art-layout{display:block;}
  .pm52-art-nav{
    position:sticky;top:62px;min-height:0;padding:12px 16px;
    border-left:0;border-bottom:1px solid rgba(255,255,255,.14);
    flex-direction:row;align-items:center;gap:14px;overflow-x:auto;
  }
  .pm52-art-nav strong,.pm52-art-nav em{display:none;}
  .pm52-art-nav nav{display:flex;gap:8px;margin:0;width:max-content;}
  .pm52-art-nav a{grid-template-columns:auto 1fr;flex:none;padding:9px 10px;}
  .pm52-art-nav a.is-active{transform:translateX(0) translateY(2px);}
  .pm52-art-hero{min-height:760px;}
  .pm52-art-hero-copy{width:100%;padding:118px 20px 62px;}
  .pm52-art-hero-copy h2{font-size:clamp(68px,22vw,112px);}
  .pm52-art-manifesto{min-height:0;}
  .pm52-art-manifesto-copy{padding:84px 20px 72px;}
  .pm52-art-manifesto-copy h3,.pm52-art-gallery-copy h3,.pm52-art-expression-copy h3{
    font-size:clamp(52px,15vw,78px);
  }
  .pm52-art-gallery{min-height:auto;padding-bottom:0;}
  .pm52-art-gallery figure{width:100%;min-height:620px;}
  .pm52-art-gallery figure img{min-height:620px;}
  .pm52-art-gallery-copy{position:relative;right:auto;top:auto;transform:none;width:auto;padding:64px 20px 84px;}
  .pm52-art-expression-copy{padding:84px 20px 72px;}
  .pm52-art-expression figure,.pm52-art-expression figure img{min-height:620px;}
  .pm52-art-finale{min-height:680px;padding:90px 20px;}
  .pm52-art-finale h3{font-size:clamp(62px,19vw,98px);}
}


/* =========================================================
   v53 — website examples detail polish
   ========================================================= */

/* Crisp vector arrows and cleaner rings */
.pm48-arrow-circle{
  width:96px !important;
  height:96px !important;
  border-width:5px !important;
  font-size:0 !important;
  -webkit-font-smoothing:antialiased;
  transform:translateZ(0);
  box-shadow:
    0 0 0 1.5px rgba(18,18,18,.22),
    0 12px 30px rgba(20,20,20,.20) !important;
}
.pm53-arrow-svg{
  width:48px;
  height:48px;
  display:block;
  overflow:visible;
}
.pm53-arrow-svg path{
  fill:none;
  stroke:currentColor;
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
  shape-rendering:geometricPrecision;
}

/* Previous arrow only appears after the visitor has used "Nächster Stil".
   It fades after five seconds and stays deliberately lighter than next. */
.pm48-style-arrow--prev{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transition:opacity .28s ease,visibility .28s ease;
}
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible{
  opacity:.46 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible:hover,
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible:focus-visible{
  opacity:1 !important;
}
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible .pm48-arrow-circle{
  background:rgba(255,255,255,.14) !important;
}
.pm43-preview-wrap.style-craft-active.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible .pm48-arrow-circle{
  background:rgba(26,26,29,.70) !important;
}
.pm43-preview-wrap.style-office-active.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible .pm48-arrow-circle{
  background:rgba(13,59,103,.72) !important;
}
.pm43-preview-wrap.style-art-active.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible .pm48-arrow-circle{
  background:rgba(9,9,9,.72) !important;
}

/* First style label now matches the style system. */
.pm43-hero .pm43-overline{
  letter-spacing:.16em;
}

/* Business / Office: descriptors are explicitly visible and the top bar is tighter. */
.pm43-preview-wrap.style-office-active .pm47-style-traits{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  color:#c9dcff !important;
  margin:0 !important;
  padding-bottom:16px !important;
}

.pm49-office-nav{
  min-height:62px !important;
  height:62px;
  padding:0 clamp(24px,4vw,62px) !important;
  justify-content:flex-start !important;
}
.pm49-office-nav::before{
  height:84px !important;
}
.pm49-office-brand{
  position:relative;
  z-index:2;
  font-size:25px !important;
  font-weight:800 !important;
  letter-spacing:-.045em !important;
}
.pm49-office-nav nav{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(18px,2.5vw,38px) !important;
  width:max-content;
}
.pm49-office-nav nav a{
  font-size:10px !important;
  letter-spacing:.10em !important;
}
.pm49-office-hero-layout{
  padding-top:clamp(94px,9vw,126px) !important;
}

/* Art / Editorial */
.pm52-art-hero-copy p.pm53-art-highlight{
  display:inline;
  padding:3px 4px 5px;
  margin-top:42px;
  line-height:1.95;
  color:#fff;
  background-image:linear-gradient(
    90deg,
    rgba(245,255,86,.30),
    rgba(205,225,80,.23)
  );
  background-repeat:no-repeat;
  background-position:left center;
  background-size:0% 100%;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
  transition:
    opacity .8s ease,
    transform .95s cubic-bezier(.22,1,.36,1),
    background-size 1.05s cubic-bezier(.2,.82,.2,1) .34s;
}
.pm52-art-hero-copy p.pm53-art-highlight.is-visible{
  background-size:100% 100%;
}

/* Removed labels leave more calm; pull the manifesto copy left so its title
   does not crowd the image. */
.pm52-art-manifesto-copy{
  padding-left:clamp(26px,4.4vw,68px) !important;
  padding-right:clamp(24px,3vw,48px) !important;
}
.pm52-art-manifesto-copy h3{
  max-width:560px;
  font-size:clamp(56px,6.25vw,98px) !important;
  margin-top:0 !important;
}
.pm52-art-expression-copy h3{
  margin-top:0 !important;
}

/* Art menu without numbers */
.pm52-art-nav a{
  grid-template-columns:1fr !important;
  gap:0 !important;
}
.pm52-art-nav a > span{
  display:none !important;
}

/* Fix old style-specific rules that forced previous arrow visible. */
.pm43-preview-wrap.style-office-active .pm48-style-arrow--prev:not(.pm53-prev-visible),
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev:not(.pm53-prev-visible),
.pm43-preview-wrap.style-art-active .pm48-style-arrow--prev:not(.pm53-prev-visible){
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

@media(max-width:980px){
  .pm49-office-nav{
    min-height:60px !important;
    height:60px;
  }
  .pm49-office-brand{
    font-size:20px !important;
  }
  .pm49-office-nav nav{
    right:24px;
    left:auto;
    transform:translateY(-50%);
  }
}
@media(max-width:700px){
  .pm48-arrow-circle{
    width:72px !important;
    height:72px !important;
    border-width:4px !important;
  }
  .pm53-arrow-svg{
    width:37px;
    height:37px;
  }
  .pm49-office-nav{
    min-height:58px !important;
    height:58px;
    padding:0 18px !important;
  }
  .pm49-office-brand{
    font-size:18px !important;
  }
  .pm49-office-nav nav{
    right:16px;
  }
}


/* =========================================================
   v54 — business + navigation polish
   ========================================================= */

/* Sharper arrow rings */
.pm48-arrow-circle{
  position:relative !important;
  overflow:visible !important;
  border:none !important;
  background:rgba(255,255,255,.12) !important;
  box-shadow:0 16px 34px rgba(10,16,28,.18) !important;
  backface-visibility:hidden;
}
.pm48-arrow-circle::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  border:2.25px solid currentColor;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);
  opacity:.92;
  pointer-events:none;
}
.pm48-style-arrow--next .pm48-arrow-circle{ color:#ffffff; }
.pm48-style-arrow--prev .pm48-arrow-circle{ color:#ffffff; }
.pm43-preview-wrap.style-craft-active .pm48-arrow-circle{
  background:rgba(18,18,18,.78) !important;
}
.pm43-preview-wrap.style-art-active .pm48-arrow-circle{
  background:rgba(14,14,14,.80) !important;
}
.pm43-preview-wrap.style-office-active .pm48-arrow-circle{
  background:#0d3b67 !important;
  box-shadow:0 18px 38px rgba(10,18,31,.26) !important;
}
.pm43-preview-wrap.style-office-active .pm48-style-arrow--next .pm48-arrow-circle,
.pm43-preview-wrap.style-office-active .pm48-style-arrow--next .pm53-arrow-svg,
.pm43-preview-wrap.style-office-active .pm48-style-arrow--next{
  color:#f3a51f !important;
}
.pm43-preview-wrap.style-office-active .pm48-style-arrow--prev .pm48-arrow-circle,
.pm43-preview-wrap.style-office-active .pm48-style-arrow--prev .pm53-arrow-svg,
.pm43-preview-wrap.style-office-active .pm48-style-arrow--prev{
  color:#f1f5fb !important;
}
.pm43-preview-wrap.style-office-active .pm48-style-arrow--next .pm48-arrow-label{
  color:#f3a51f !important;
}

/* Previous arrow now stays visible after first next click; only the label fades away. */
.pm48-style-arrow--prev{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible{
  opacity:.42 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible:hover,
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible:focus-visible{
  opacity:1 !important;
}
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm54-prev-label-hidden .pm48-arrow-label{
  opacity:0 !important;
  visibility:hidden !important;
  transform:translateX(-8px) !important;
  max-width:0 !important;
  margin:0 !important;
  overflow:hidden !important;
}
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev .pm48-arrow-label{
  transition:opacity .28s ease, transform .28s ease, max-width .28s ease, margin .28s ease;
  max-width:120px;
}

/* Office style: clearer top area and visible character traits */
.pm43-preview-wrap.style-office-active .pm47-style-traits{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  color:#cfe1ff !important;
  margin-bottom:10px !important;
}
.pm49-office-nav{
  min-height:60px !important;
  height:60px !important;
  box-shadow:0 -78px 0 #0d3b67 !important;
}
.pm49-office-nav::before{
  height:78px !important;
}
.pm49-office-hero{
  min-height:clamp(590px,74vh,760px) !important;
}
.pm49-office-hero-layout{
  padding:clamp(84px,8vw,102px) clamp(28px,7vw,118px) clamp(60px,7vw,88px) !important;
  align-items:end !important;
}
.pm54-office-traits-inline{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 18px;
}
.pm54-office-traits-inline span{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 14px;
  border:1px solid rgba(243,165,31,.48);
  background:rgba(11,57,100,.34);
  color:#eef4ff;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  backdrop-filter:blur(6px);
}

/* Replace lower image block with centered contact ending */
.pm54-office-contact{
  grid-template-columns:1fr !important;
  justify-items:center;
  text-align:center;
}
.pm54-office-contact .pm51-office-contact-intro{
  max-width:740px !important;
  text-align:center !important;
}
.pm54-office-contact .pm51-office-contact-intro p{
  margin-left:auto !important;
  margin-right:auto !important;
  max-width:680px;
}
.pm54-office-contact .pm51-office-contact-image{
  display:none !important;
}
.pm54-office-contact .pm51-office-form{
  width:min(100%,840px);
}
.pm54-office-contact .pm51-office-form-footer{
  justify-content:center;
}
.pm54-office-contact .pm51-office-form-footer small{
  text-align:left;
}

/* Office chart section */
.pm54-office-values{
  display:grid !important;
  grid-template-columns:minmax(320px,1.02fr) minmax(320px,.98fr) !important;
  gap:clamp(34px,5vw,72px) !important;
  align-items:center !important;
  padding:clamp(100px,10vw,150px) clamp(28px,7vw,118px) !important;
  min-height:0 !important;
}
.pm54-office-chart-panel{
  margin:0;
  padding:28px;
  background:linear-gradient(180deg,#ffffff 0%,#f7f9fc 100%);
  border:1px solid rgba(13,59,103,.10);
  box-shadow:0 24px 54px rgba(14,44,73,.09);
}
.pm54-office-chart-meta{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:20px;
}
.pm54-office-chart-meta small{
  color:#d68d13;
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.pm54-office-chart-meta strong{
  color:#153657;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:26px;
  font-weight:600;
  line-height:1.2;
}
.pm54-office-chart{
  position:relative;
  min-height:330px;
  padding:22px 18px 16px;
  background:linear-gradient(180deg,rgba(231,238,246,.72) 0%,rgba(255,255,255,.96) 100%);
  border:1px solid rgba(13,59,103,.08);
}
.pm54-chart-grid{
  position:absolute;
  inset:18px 18px 48px;
  background:repeating-linear-gradient(
    to top,
    rgba(13,59,103,.09) 0,
    rgba(13,59,103,.09) 1px,
    transparent 1px,
    transparent 54px
  );
  pointer-events:none;
}
.pm54-chart-bars{
  position:relative;
  z-index:1;
  min-height:292px;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  align-items:end;
  gap:18px;
}
.pm54-chart-bar{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  min-height:292px;
}
.pm54-chart-value{
  color:#173453;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:15px;
  font-weight:700;
  opacity:0;
  transform:translateY(10px);
}
.pm54-chart-column{
  display:block;
  width:min(100%,70px);
  height:var(--pm54-bar-h);
  min-height:28px;
  border-radius:18px 18px 0 0;
  background:linear-gradient(180deg,#f7c768 0%,#f3a51f 18%,#0d3b67 100%);
  box-shadow:0 12px 24px rgba(13,59,103,.18);
  transform-origin:bottom center;
  transform:scaleY(.12);
  opacity:.55;
}
.pm54-chart-bar small{
  color:#58708b;
  font-size:12px;
  font-weight:700;
  letter-spacing:.05em;
}
.pm54-office-chart-panel.is-visible .pm54-chart-column{
  animation:pm54BarGrow .78s cubic-bezier(.2,.85,.22,1) forwards, pm54BarGlow 1.1s ease forwards;
}
.pm54-office-chart-panel.is-visible .pm54-chart-value{
  animation:pm54ValueIn .46s ease forwards;
}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(1) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(1) .pm54-chart-value{ animation-delay:.04s, .04s; }
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(2) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(2) .pm54-chart-value{ animation-delay:.16s, .16s; }
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(3) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(3) .pm54-chart-value{ animation-delay:.28s, .28s; }
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(4) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(4) .pm54-chart-value{ animation-delay:.40s, .40s; }
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(5) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(5) .pm54-chart-value{ animation-delay:.52s, .52s; }

@keyframes pm54BarGrow{
  from{ transform:scaleY(.12); opacity:.52; }
  to{ transform:scaleY(1); opacity:1; }
}
@keyframes pm54BarGlow{
  0%,65%{ box-shadow:0 12px 24px rgba(13,59,103,.18); }
  40%{ box-shadow:0 0 0 7px rgba(243,165,31,.16), 0 18px 34px rgba(13,59,103,.22); }
  100%{ box-shadow:0 12px 24px rgba(13,59,103,.18); }
}
@keyframes pm54ValueIn{
  from{ opacity:0; transform:translateY(10px); }
  to{ opacity:1; transform:translateY(0); }
}

@media(max-width:980px){
  .pm49-office-nav{
    box-shadow:0 -68px 0 #0d3b67 !important;
  }
  .pm49-office-nav::before{ height:68px !important; }
  .pm54-office-values{
    grid-template-columns:1fr !important;
  }
  .pm54-office-contact .pm51-office-form{
    width:100%;
  }
}
@media(max-width:700px){
  .pm49-office-nav{
    min-height:58px !important;
    height:58px !important;
    box-shadow:0 -62px 0 #0d3b67 !important;
  }
  .pm49-office-nav::before{ height:62px !important; }
  .pm49-office-hero-layout{
    padding:92px 20px 48px !important;
  }
  .pm54-office-traits-inline{
    gap:8px;
  }
  .pm54-office-traits-inline span{
    min-height:32px;
    padding:0 12px;
    font-size:10px;
  }
  .pm54-office-chart-panel{
    padding:20px;
  }
  .pm54-office-chart{
    min-height:280px;
  }
  .pm54-chart-bars,
  .pm54-chart-bar{
    min-height:236px;
  }
}


/* =========================================================
   v55 — arrow language, external style traits, calmer motion
   ========================================================= */

/* One consistent professional label font across every example. */
.pm48-arrow-label,
.pm43-preview-wrap.style-craft-active .pm48-arrow-label,
.pm43-preview-wrap.style-office-active .pm48-arrow-label,
.pm43-preview-wrap.style-art-active .pm48-arrow-label{
  font-family:"Inter",sans-serif !important;
  font-size:15px !important;
  font-weight:700 !important;
  line-height:1 !important;
  letter-spacing:.02em !important;
}

/* Keep the crisp v54 vector ring, but restore the intended color language. */
.pm48-arrow-circle{
  background:rgba(18,18,18,.10) !important;
  color:#151311 !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.06),
    0 14px 32px rgba(12,12,12,.18) !important;
}
.pm48-arrow-circle::before{
  border-color:currentColor !important;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08) !important;
}
.pm48-style-arrow--next,
.pm48-style-arrow--prev,
.pm48-style-arrow--next .pm53-arrow-svg,
.pm48-style-arrow--prev .pm53-arrow-svg,
.pm48-style-arrow--next .pm48-arrow-label,
.pm48-style-arrow--prev .pm48-arrow-label{
  color:#171512 !important;
}

/* Craft: charcoal / red, including the previous control. */
.pm43-preview-wrap.style-craft-active .pm48-arrow-circle{
  background:rgba(24,24,27,.94) !important;
  color:#ef4b43 !important;
  box-shadow:
    0 0 0 1px rgba(227,58,50,.10),
    0 16px 36px rgba(0,0,0,.30) !important;
}
.pm43-preview-wrap.style-craft-active .pm48-arrow-circle::before{
  border-color:rgba(227,58,50,.78) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05) !important;
}
.pm43-preview-wrap.style-craft-active .pm48-style-arrow,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow .pm53-arrow-svg,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow .pm48-arrow-label{
  color:#ef4b43 !important;
}

/* Business: visibly solid navy circle; next keeps the orange accent. */
.pm43-preview-wrap.style-office-active .pm48-arrow-circle{
  background:rgba(8,45,80,.98) !important;
  box-shadow:
    0 0 0 1px rgba(9,42,74,.18),
    0 18px 38px rgba(7,24,42,.30) !important;
}
.pm43-preview-wrap.style-office-active .pm48-arrow-circle::before{
  border-color:rgba(243,165,31,.80) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07) !important;
}
.pm43-preview-wrap.style-office-active .pm48-style-arrow--next,
.pm43-preview-wrap.style-office-active .pm48-style-arrow--next .pm53-arrow-svg,
.pm43-preview-wrap.style-office-active .pm48-style-arrow--next .pm48-arrow-label{
  color:#f3a51f !important;
}
.pm43-preview-wrap.style-office-active .pm48-style-arrow--prev,
.pm43-preview-wrap.style-office-active .pm48-style-arrow--prev .pm53-arrow-svg,
.pm43-preview-wrap.style-office-active .pm48-style-arrow--prev .pm48-arrow-label{
  color:#dce8f6 !important;
}

/* Art stays deliberately high-contrast. */
.pm43-preview-wrap.style-art-active .pm48-arrow-circle{
  background:rgba(12,12,12,.94) !important;
  color:#f5ff56 !important;
}
.pm43-preview-wrap.style-art-active .pm48-arrow-circle::before{
  border-color:rgba(245,255,86,.78) !important;
}
.pm43-preview-wrap.style-art-active .pm48-style-arrow,
.pm43-preview-wrap.style-art-active .pm48-style-arrow .pm53-arrow-svg,
.pm43-preview-wrap.style-art-active .pm48-style-arrow .pm48-arrow-label{
  color:#f5ff56 !important;
}

/* The back arrow uses the same style colors, but remains quieter until hover. */
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible{
  opacity:.48 !important;
}
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible:hover,
.pm43-preview-wrap.pm53-history-enabled .pm48-style-arrow--prev.pm53-prev-visible:focus-visible{
  opacity:1 !important;
}

/* Style 03 traits belong to Noirin, above the example — not inside the navy site. */
.pm54-office-traits-inline{
  display:none !important;
}
.pm43-preview-wrap.style-office-active .pm47-style-traits{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  margin:0 !important;
  padding:0 var(--pad) 20px !important;
  background:transparent !important;
  color:#c9dcff !important;
  font-family:"Inter",sans-serif !important;
  font-size:clamp(28px,3vw,43px) !important;
  font-weight:600 !important;
  line-height:1 !important;
  letter-spacing:-.025em !important;
  text-shadow:0 0 24px rgba(95,130,190,.12) !important;
}

/* Tighter business hero so the navy section no longer dominates vertically. */
.pm49-office-hero{
  min-height:clamp(500px,64vh,650px) !important;
}
.pm49-office-hero-layout{
  padding:clamp(72px,7vw,88px) clamp(28px,7vw,118px) clamp(52px,6vw,72px) !important;
}
.pm49-office-nav{
  min-height:58px !important;
  height:58px !important;
  box-shadow:0 -64px 0 #0d3b67 !important;
}
.pm49-office-nav::before{
  height:64px !important;
}

/* Craft reveals and count-ups are intentionally slower and easier to notice. */
[data-craft-reveal]{
  transition:opacity 1.05s ease,transform 1.22s cubic-bezier(.22,1,.36,1) !important;
}

@media(max-width:980px){
  .pm49-office-hero{
    min-height:clamp(520px,68vh,680px) !important;
  }
  .pm49-office-nav{
    box-shadow:0 -62px 0 #0d3b67 !important;
  }
  .pm49-office-nav::before{height:62px !important;}
}
@media(max-width:700px){
  .pm48-arrow-label,
  .pm43-preview-wrap.style-craft-active .pm48-arrow-label,
  .pm43-preview-wrap.style-office-active .pm48-arrow-label,
  .pm43-preview-wrap.style-art-active .pm48-arrow-label{
    font-size:12px !important;
  }
  .pm43-preview-wrap.style-office-active .pm47-style-traits{
    font-size:clamp(24px,7vw,34px) !important;
  }
  .pm49-office-hero{
    min-height:650px !important;
  }
  .pm49-office-hero-layout{
    padding:84px 20px 48px !important;
  }
}


/* =========================================================
   v56 — final Webdesign polish: traits, business chart,
   craft sticky navigation and slower metric counters
   ========================================================= */

/* The trait line is always a Noirin-level label ABOVE the live example.
   Give it a stable slot so Style 03 cannot be swallowed by the navy hero. */
.pm47-style-traits{
  position:relative !important;
  z-index:35 !important;
  display:flex !important;
  align-items:flex-end !important;
  min-height:64px !important;
  margin:0 !important;
  padding:0 var(--pad) 20px !important;
  background:transparent !important;
  border:0 !important;
  pointer-events:none;
}
.pm43-preview-wrap.style-office-active .pm47-style-traits{
  display:flex !important;
  opacity:1 !important;
  visibility:visible !important;
  min-height:64px !important;
  margin:0 !important;
  padding:0 var(--pad) 20px !important;
  background:transparent !important;
  color:#b9d2f2 !important;
  font-family:"Inter",sans-serif !important;
  font-size:clamp(20px,2.15vw,30px) !important;
  font-weight:700 !important;
  line-height:1 !important;
  letter-spacing:-.02em !important;
  text-shadow:0 0 20px rgba(115,155,205,.13) !important;
}

/* The business example begins only AFTER the trait slot. No navy bleed above it. */
.pm43-preview-wrap.style-office-active .pm44-style-stage{
  background:transparent !important;
}
.pm49-office{
  margin-top:0 !important;
}

/* Simple fictional business mark above the example site name. */
.pm49-office-brand{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  gap:3px !important;
  line-height:1 !important;
}
.pm56-office-logo{
  position:relative;
  width:28px;
  height:18px;
  display:grid;
  place-items:center;
  color:#0d3b67;
  background:#f3a51f;
  border-radius:2px;
  font-family:"Inter",sans-serif;
  font-size:10px;
  font-weight:800;
  letter-spacing:0;
  overflow:hidden;
}
.pm56-office-logo i{
  position:absolute;
  width:18px;
  height:18px;
  left:-9px;
  top:-8px;
  border:1px solid rgba(13,59,103,.42);
  transform:rotate(45deg);
}
.pm56-office-logo b{
  position:relative;
  z-index:1;
  font:inherit;
}
.pm56-office-brand-name{
  display:block;
  white-space:nowrap;
}

/* More transparent navy navigation controls on Style 03. */
.pm43-preview-wrap.style-office-active .pm48-arrow-circle{
  background:rgba(8,45,80,.58) !important;
  backdrop-filter:blur(7px) !important;
  -webkit-backdrop-filter:blur(7px) !important;
  box-shadow:
    0 0 0 1px rgba(9,42,74,.12),
    0 16px 34px rgba(7,24,42,.18) !important;
}
.pm43-preview-wrap.style-office-active .pm48-arrow-circle::before{
  border-color:rgba(243,165,31,.72) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06) !important;
}

/* Business chart: unmistakably increasing bars, orange only, slower sequence. */
.pm54-chart-column{
  flex:0 0 auto !important;
  height:var(--pm54-bar-h) !important;
  min-height:0 !important;
  background:#f3a51f !important;
  border-radius:12px 12px 0 0 !important;
  box-shadow:0 10px 24px rgba(243,165,31,.16) !important;
  transform:scaleY(.05) !important;
  opacity:.48 !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-column{
  animation:pm56BarGrow 1.65s cubic-bezier(.2,.78,.18,1) forwards !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-value{
  animation:pm56ValueIn .72s ease forwards !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(1) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(1) .pm54-chart-value{animation-delay:.12s !important;}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(2) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(2) .pm54-chart-value{animation-delay:.44s !important;}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(3) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(3) .pm54-chart-value{animation-delay:.76s !important;}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(4) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(4) .pm54-chart-value{animation-delay:1.08s !important;}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(5) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(5) .pm54-chart-value{animation-delay:1.40s !important;}
@keyframes pm56BarGrow{
  0%{transform:scaleY(.05);opacity:.42;}
  72%{opacity:1;}
  100%{transform:scaleY(1);opacity:1;}
}
@keyframes pm56ValueIn{
  from{opacity:0;transform:translateY(9px);}
  to{opacity:1;transform:translateY(0);}
}

/* Style 02 sticky menu: completely mask the area above it while it is pinned,
   so underlying workshop content never shows through the top gap. */
.pm44-craft-nav{
  background:rgba(28,28,31,.98) !important;
  isolation:isolate;
}
.pm44-craft-nav::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:0;
  right:0;
  bottom:100%;
  height:110px;
  background:#1c1c1f;
  pointer-events:none;
}

@media(max-width:980px){
  .pm44-craft-nav::before{height:100px;}
}
@media(max-width:700px){
  .pm47-style-traits,
  .pm43-preview-wrap.style-office-active .pm47-style-traits{
    min-height:54px !important;
    padding:0 20px 16px !important;
    font-size:clamp(18px,5.8vw,24px) !important;
  }
  .pm44-craft-nav::before{height:90px;}
  .pm56-office-logo{width:24px;height:16px;font-size:9px;}
}


/* =========================================================
   v58 — selective rollback + targeted fixes
   Base: v56, because Style 02's sticky navigation worked there.
   ========================================================= */

/* STYLE 03 — traits stay on Noirin's normal page background,
   completely outside the navy example. */
.pm43-preview-wrap.style-office-active .pm47-style-traits{
  position:relative !important;
  z-index:40 !important;
  display:flex !important;
  align-items:center !important;
  min-height:60px !important;
  margin:0 !important;
  padding:0 var(--pad) 18px !important;
  background:transparent !important;
  border:0 !important;
  color:#c5d9f5 !important;
  font-family:"Inter",sans-serif !important;
  font-size:clamp(21px,2.2vw,31px) !important;
  font-weight:650 !important;
  line-height:1 !important;
  letter-spacing:-.018em !important;
  text-shadow:0 0 18px rgba(104,145,198,.11) !important;
}
.pm43-preview-wrap.style-office-active .pm44-style-stage{
  background:transparent !important;
}
.pm49-office{
  margin-top:0 !important;
}

/* Slightly taller than v57, but still compact. */
.pm49-office-hero{
  min-height:clamp(470px,58vh,600px) !important;
}
.pm49-office-hero-layout{
  padding:clamp(64px,6vw,78px) clamp(28px,7vw,118px) clamp(48px,5.5vw,64px) !important;
  gap:clamp(30px,4vw,60px) !important;
}

/* Enough room for the circular logo, without extending navy upward
   into the traits area. */
.pm49-office-nav{
  min-height:76px !important;
  height:76px !important;
  background:#0d3b67 !important;
  box-shadow:none !important;
}
.pm49-office-nav::before{
  display:none !important;
  content:none !important;
}

/* Center the white logo above the website name. */
.pm49-office-brand{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  text-align:center !important;
  line-height:1 !important;
}
.pm58-office-logo{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1.5px solid rgba(255,255,255,.92);
  background:rgba(255,255,255,.04);
  color:#fff;
  font-family:"Inter",sans-serif;
  font-size:8px;
  font-weight:800;
  line-height:1.05;
  letter-spacing:.02em;
  text-align:center;
  text-transform:uppercase;
}
.pm56-office-brand-name{
  display:block !important;
  white-space:nowrap;
  color:#fff !important;
}

/* Keep the business menu centered. */
.pm49-office-nav nav{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) !important;
  width:max-content;
}

/* STYLE 03 chart — keep the good v57 pacing, but leave every bar
   permanently at its final height after the reveal. */
.pm54-chart-column{
  animation:none !important;
  transform:scaleY(.035) !important;
  transform-origin:bottom center !important;
  opacity:.40 !important;
  background:#f3a51f !important;
  transition:
    transform 2.15s cubic-bezier(.18,.76,.18,1),
    opacity .72s ease,
    box-shadow .72s ease !important;
}
.pm54-chart-value{
  animation:none !important;
  opacity:0 !important;
  transform:translateY(10px) !important;
  transition:opacity .58s ease,transform .58s ease !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-column{
  animation:none !important;
  transform:scaleY(1) !important;
  opacity:1 !important;
  box-shadow:0 12px 26px rgba(243,165,31,.18) !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-value{
  animation:none !important;
  opacity:1 !important;
  transform:translateY(0) !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(1) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(1) .pm54-chart-value{
  transition-delay:.12s !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(2) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(2) .pm54-chart-value{
  transition-delay:.52s !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(3) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(3) .pm54-chart-value{
  transition-delay:.92s !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(4) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(4) .pm54-chart-value{
  transition-delay:1.32s !important;
}
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(5) .pm54-chart-column,
.pm54-office-chart-panel.is-visible .pm54-chart-bar:nth-child(5) .pm54-chart-value{
  transition-delay:1.72s !important;
}

@media(max-width:980px){
  .pm49-office-nav{
    min-height:72px !important;
    height:72px !important;
  }
  .pm49-office-hero{
    min-height:clamp(490px,62vh,620px) !important;
  }
}
@media(max-width:700px){
  .pm43-preview-wrap.style-office-active .pm47-style-traits{
    min-height:54px !important;
    padding:0 20px 16px !important;
    font-size:clamp(19px,5.8vw,25px) !important;
  }
  .pm49-office-nav{
    min-height:68px !important;
    height:68px !important;
    padding:0 18px !important;
  }
  .pm58-office-logo{
    width:40px;
    height:40px;
    flex-basis:40px;
    font-size:7px;
  }
  .pm49-office-hero{
    min-height:610px !important;
  }
  .pm49-office-hero-layout{
    padding:58px 20px 44px !important;
  }
}


/* =========================================================
   v59 — final refinements after v58
   ========================================================= */

/* STYLE 02 (direkt / technisch / selbstbewusst)
   Keep the traits clearly on Noirin's normal background. */
.pm43-preview-wrap.style-craft-active .pm47-style-traits{
  background:transparent !important;
  margin:0 0 14px !important;
  padding:0 var(--pad) 18px !important;
}
.pm43-preview-wrap.style-craft-active .pm44-style-stage{
  background:transparent !important;
}

/* Remove the black extension that visually glued the sticky menu to the traits line. */
.pm44-craft-nav::before{
  display:none !important;
  content:none !important;
}
.pm44-craft-nav{
  box-shadow:none !important;
}

/* STYLE 02 arrows:
   white label, white ring, soft red transparent fill, black arrow icon. */
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--next .pm48-arrow-label,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev .pm48-arrow-label{
  color:#ffffff !important;
}
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--next .pm48-arrow-circle,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev .pm48-arrow-circle{
  background:rgba(227,58,50,.36) !important;
  color:#111111 !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.18),
    0 14px 32px rgba(0,0,0,.22) !important;
}
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--next .pm48-arrow-circle::before,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev .pm48-arrow-circle::before{
  border-color:rgba(255,255,255,.92) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08) !important;
}
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--next .pm53-arrow-svg,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev .pm53-arrow-svg{
  color:#111111 !important;
}

/* STYLE 03 (Business) */
/* Keep the office traits above the example on the regular background. */
.pm43-preview-wrap.style-office-active .pm47-style-traits{
  min-height:64px !important;
  padding:0 var(--pad) 18px !important;
  margin:0 0 4px !important;
  background:transparent !important;
  font-size:clamp(19px,2vw,27px) !important;
}

/* Make the sticky office menu truly stick to the top with no peek-through above it. */
.pm49-office-nav{
  top:0 !important;
  min-height:86px !important;
  height:86px !important;
  padding:0 clamp(24px,4.5vw,74px) !important;
  background:#0d3b67 !important;
  border-bottom:1px solid rgba(255,255,255,.09) !important;
  box-shadow:none !important;
}
.pm49-office-nav::before{
  display:none !important;
  content:none !important;
}

/* Larger centered logo within the left brand block; website name removed. */
.pm49-office-brand{
  flex:0 0 170px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  gap:0 !important;
  line-height:1 !important;
}
.pm58-office-logo{
  width:72px !important;
  height:72px !important;
  flex:0 0 72px !important;
  border-radius:50% !important;
  border:2px solid rgba(255,255,255,.96) !important;
  background:transparent !important;
  color:#ffffff !important;
  font-size:11px !important;
  font-weight:800 !important;
  line-height:1.05 !important;
  letter-spacing:.02em !important;
}
.pm56-office-brand-name{
  display:none !important;
}

/* Keep the menu itself centered. */
.pm49-office-nav nav{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) !important;
  width:max-content !important;
}

/* Remove the unnecessary secondary action completely if any styling remains. */
.pm51-office-secondary{
  display:none !important;
}

@media(max-width:980px){
  .pm49-office-nav{
    top:0 !important;
    min-height:80px !important;
    height:80px !important;
  }
  .pm49-office-brand{
    flex-basis:140px !important;
  }
  .pm58-office-logo{
    width:62px !important;
    height:62px !important;
    flex-basis:62px !important;
    font-size:10px !important;
  }
}

@media(max-width:700px){
  .pm43-preview-wrap.style-craft-active .pm47-style-traits,
  .pm43-preview-wrap.style-office-active .pm47-style-traits{
    padding:0 20px 16px !important;
  }
  .pm49-office-nav{
    top:0 !important;
    min-height:74px !important;
    height:74px !important;
    padding:0 18px !important;
  }
  .pm49-office-brand{
    flex-basis:110px !important;
  }
  .pm58-office-logo{
    width:52px !important;
    height:52px !important;
    flex-basis:52px !important;
    font-size:9px !important;
  }
}


/* =========================================================
   v60 — sticky-menu fixes + conversion CTA system
   ========================================================= */

/* Both internal example menus sit fully BELOW the fixed Noirin header. */
.pm44-craft-nav,
.pm49-office-nav{
  position:sticky !important;
  top:var(--pm60-site-header-h,76px) !important;
  z-index:28 !important;
}

/* Only while actually pinned, mask the small area behind the fixed Noirin header.
   This prevents the underlying example page from peeking through without
   permanently adding an extra bar above the examples. */
.pm44-craft-nav.pm60-is-pinned,
.pm49-office-nav.pm60-is-pinned{
  isolation:isolate;
}
.pm44-craft-nav.pm60-is-pinned::before,
.pm49-office-nav.pm60-is-pinned::before{
  display:block !important;
  content:"" !important;
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  height:var(--pm60-site-header-h,76px) !important;
  pointer-events:none;
  z-index:0 !important;
}
.pm44-craft-nav.pm60-is-pinned::before{
  background:#1c1c1f !important;
}
.pm49-office-nav.pm60-is-pinned::before{
  background:#0d3b67 !important;
}
.pm44-craft-nav > *,
.pm49-office-nav > *{
  position:relative;
  z-index:1;
}

/* Style 02 arrow correction: white label + white arrow, transparent red fill. */
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--next .pm48-arrow-label,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev .pm48-arrow-label,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--next .pm53-arrow-svg,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev .pm53-arrow-svg{
  color:#ffffff !important;
}
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--next .pm48-arrow-circle,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev .pm48-arrow-circle{
  background:rgba(227,58,50,.34) !important;
  color:#ffffff !important;
}
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--next .pm48-arrow-circle::before,
.pm43-preview-wrap.style-craft-active .pm48-style-arrow--prev .pm48-arrow-circle::before{
  border-color:rgba(255,255,255,.94) !important;
}

/* Compact long sample headings a little so the examples breathe more naturally. */
.pm43-about-copy h3,
.pm43-section-head h3,
.pm43-option-copy h3,
.pm43-contact-copy h3{
  font-size:clamp(34px,3.65vw,58px) !important;
}
.pm44-section-heading h3,
.pm44-work-copy h3,
.pm44-finale-copy h3{
  max-width:760px;
}
.pm49-office-text h3,
.pm54-values-copy h3,
.pm51-office-contact-intro h3{
  max-width:760px;
}

/* Style 01 persistent conversion CTA in sidebar */
.pm60-soft-menu-cta{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  margin-top:28px;
  padding:0 16px;
  border:1px solid rgba(35,29,24,.20);
  background:#2f5c53;
  color:#fff !important;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
}

/* Shared bottom conversion block */
.pm60-convert{
  grid-column:1 / -1;
  width:100%;
  margin-top:44px;
  padding:30px 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.pm60-convert small{
  display:block;
  margin-bottom:6px;
  font-size:9px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.pm60-convert strong{
  display:block;
  font-size:clamp(22px,2.2vw,34px);
  line-height:1.1;
}
.pm60-convert a{
  flex:none;
  display:inline-flex;
  align-items:center;
  gap:12px;
  min-height:50px;
  padding:0 22px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.pm60-convert-soft{
  background:#2f5c53;
  color:#fff;
}
.pm60-convert-soft small{ color:rgba(255,255,255,.60); }
.pm60-convert-soft a{
  background:#fff;
  color:#2f5c53;
}
.pm60-convert-office{
  background:#0d3b67;
  color:#fff;
}
.pm60-convert-office small{ color:#f3a51f; }
.pm60-convert-office a{
  background:#f3a51f;
  color:#102f52;
}

/* Style 02 and 03 menu conversion buttons */
.pm44-craft-nav .pm44-nav-cta,
.pm49-office-nav .pm49-nav-cta{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px !important;
  font-weight:800 !important;
  white-space:nowrap;
}

/* Art menu conversion CTA */
.pm60-art-menu-cta{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  margin-top:26px;
  border:1px solid var(--art-accent);
  color:#090909 !important;
  background:var(--art-accent);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.pm60-art-cta{
  padding:15px 19px !important;
  border:2px solid var(--art-accent) !important;
  background:rgba(245,255,86,.06);
}

/* =========================================================
   v60 — project inquiry page
   ========================================================= */
.pm60-contact-main{
  padding-top:128px;
}
.pm60-contact-hero{
  padding:76px 0 92px;
  border-bottom:1px solid var(--line);
}
.pm60-contact-hero small{
  display:block;
  margin-bottom:18px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent-strong);
}
.pm60-contact-hero h1{
  margin:0;
  max-width:1000px;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(60px,8vw,126px);
  font-weight:500;
  line-height:.88;
  letter-spacing:-.065em;
}
.pm60-contact-hero p{
  max-width:700px;
  margin:34px 0 0;
  color:rgba(241,238,232,.60);
  font-size:15px;
  line-height:1.8;
}

.pm60-project-request{
  padding:88px 0 120px;
}
.pm60-request-intro{
  display:grid;
  grid-template-columns:70px minmax(0,760px);
  gap:28px;
  margin-bottom:50px;
}
.pm60-request-intro > span{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  color:var(--muted);
  letter-spacing:.16em;
}
.pm60-request-intro h2{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(34px,4vw,58px);
  font-weight:500;
  letter-spacing:-.045em;
}
.pm60-request-intro p{
  margin:14px 0 0;
  max-width:620px;
  color:var(--muted);
  line-height:1.75;
  font-size:13px;
}

.pm60-request-form{
  max-width:1120px;
  margin-left:98px;
}
.pm60-style-choice{
  margin:0 0 38px;
  padding:0;
  border:0;
}
.pm60-style-choice legend,
.pm60-request-form label > span{
  display:block;
  margin-bottom:10px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}
.pm60-style-choice{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:10px;
}
.pm60-style-choice legend{
  grid-column:1/-1;
}
.pm60-style-choice label{
  position:relative;
  cursor:pointer;
}
.pm60-style-choice input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.pm60-style-choice label > span{
  height:100%;
  min-height:112px;
  margin:0;
  padding:18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.015);
  color:var(--fg);
  transition:.22s ease;
}
.pm60-style-choice b{
  display:block;
  margin-bottom:10px;
  font-size:17px;
  font-weight:500;
  text-transform:none;
  letter-spacing:-.02em;
}
.pm60-style-choice small{
  display:block;
  color:var(--muted);
  font-size:10px;
  line-height:1.55;
  text-transform:none;
  letter-spacing:0;
}
.pm60-style-choice input:checked + span{
  border-color:var(--accent);
  background:rgba(159,123,255,.10);
  box-shadow:inset 0 0 0 1px rgba(159,123,255,.20);
}
.pm60-request-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.pm60-request-form input,
.pm60-request-form textarea{
  width:100%;
  border:1px solid var(--line);
  background:rgba(255,255,255,.025);
  color:var(--fg);
  font:inherit;
  padding:15px 16px;
  outline:none;
}
.pm60-request-form input:focus,
.pm60-request-form textarea:focus{
  border-color:var(--accent);
}
.pm60-request-full{
  display:block;
  margin-top:18px;
}
.pm60-request-submit{
  margin-top:26px;
  padding-top:22px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
}
.pm60-request-submit p{
  margin:0;
  color:var(--muted);
  font-size:12px;
}
.pm60-request-submit button{
  min-height:54px;
  padding:0 26px;
  border:0;
  background:var(--accent-strong);
  color:#fff;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
  cursor:pointer;
}

@media(max-width:980px){
  .pm60-request-form{ margin-left:0; }
  .pm60-style-choice{ grid-template-columns:repeat(2,1fr); }
  .pm60-convert{ align-items:flex-start; }
}
@media(max-width:700px){
  .pm60-contact-main{ padding-top:102px; }
  .pm60-contact-hero{ padding:54px 0 66px; }
  .pm60-request-intro{ grid-template-columns:1fr; gap:12px; }
  .pm60-request-grid{ grid-template-columns:1fr; }
  .pm60-style-choice{ grid-template-columns:1fr; }
  .pm60-request-submit,
  .pm60-convert{
    flex-direction:column;
    align-items:stretch;
  }
  .pm60-convert a,
  .pm60-request-submit button{
    width:100%;
    justify-content:center;
  }
}


/* =========================================================
   v61 — own-website CTA refinement
   ========================================================= */

/* Style 01 — CTA is a real menu item below Contact. */
.pm43-side-nav .pm61-menu-divider{
  display:block;
  height:1px;
  margin:9px 0 3px;
  background:rgba(35,29,24,.20);
}
.pm43-side-nav .pm60-soft-menu-cta.pm61-menu-cta{
  display:flex !important;
  align-items:center;
  justify-content:center;
  min-height:48px;
  margin:0 !important;
  padding:0 12px !important;
  border:1px solid #2f5c53 !important;
  background:#2f5c53 !important;
  color:#fff !important;
  font-family:"Syne","Bricolage Grotesque",sans-serif !important;
  font-size:9px !important;
  font-weight:700 !important;
  letter-spacing:.08em !important;
  line-height:1.25 !important;
  text-align:center;
  text-transform:uppercase;
}
.pm43-side-nav .pm60-soft-menu-cta.pm61-menu-cta:hover{
  background:#264e47 !important;
  color:#fff !important;
}

/* Slightly tighter wording still gets enough space in sticky menus. */
.pm44-craft-nav .pm44-nav-cta,
.pm49-office-nav .pm49-nav-cta{
  white-space:nowrap;
  font-size:9px !important;
  letter-spacing:.07em !important;
  padding-left:15px !important;
  padding-right:15px !important;
}

/* Style 03 — stronger orange invitation above the main conversion sentence. */
.pm60-convert-office small{
  font-size:clamp(14px,1.2vw,18px) !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  letter-spacing:.035em !important;
  text-transform:none !important;
  margin-bottom:10px !important;
}
.pm60-convert-office strong{
  font-size:clamp(25px,2.45vw,39px) !important;
}

/* Style 04 — CTA is part of the scrolling menu itself. */
.pm52-art-nav nav .pm61-art-divider{
  display:block;
  height:1px;
  margin:12px 0 3px;
  background:rgba(245,255,86,.42);
}
.pm52-art-nav nav .pm60-art-menu-cta.pm61-art-menu-cta{
  display:flex !important;
  align-items:center;
  justify-content:center;
  min-height:48px;
  margin:0 !important;
  padding:0 11px !important;
  border:1px solid var(--art-accent) !important;
  background:var(--art-accent) !important;
  color:#090909 !important;
  transform:none !important;
  font-family:"Syne","Bricolage Grotesque",sans-serif !important;
  font-size:9px !important;
  font-weight:800 !important;
  letter-spacing:.075em !important;
  line-height:1.2 !important;
  text-align:center;
  text-transform:uppercase;
}
.pm52-art-nav nav .pm60-art-menu-cta.pm61-art-menu-cta:hover{
  background:#f8ff78 !important;
  border-color:#f8ff78 !important;
  color:#090909 !important;
  transform:none !important;
}

@media(max-width:980px){
  .pm44-craft-nav .pm44-nav-cta,
  .pm49-office-nav .pm49-nav-cta{
    font-size:8px !important;
    padding-left:11px !important;
    padding-right:11px !important;
  }
}


/* =========================================================
   v62 — menu refinement + warmer contact page
   ========================================================= */

/* Style 01: make the CTA a real menu item, not a separate button. */
.pm43-side-nav .pm61-menu-divider{ display:none !important; }
.pm43-side-nav .pm60-soft-menu-cta.pm61-menu-cta{
  display:block !important;
  min-height:0 !important;
  margin:0 !important;
  padding:10px 14px 10px 16px !important;
  border:0 !important;
  border-bottom:1px solid rgba(35,29,24,.10) !important;
  background:#2f5c53 !important;
  color:#fff !important;
  font-family:"Inter",sans-serif !important;
  font-size:12px !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
  line-height:1.3 !important;
  text-align:left !important;
  text-transform:none !important;
}
.pm43-side-nav .pm60-soft-menu-cta.pm61-menu-cta:hover{
  background:#274b45 !important;
  color:#fff !important;
}

/* Style 03: sharper, cleaner menu text without transform blur. */
.pm49-office-nav{
  display:grid !important;
  grid-template-columns:220px minmax(0,1fr) 220px !important;
  align-items:center !important;
}
.pm49-office-brand{
  grid-column:1 !important;
  justify-self:center !important;
}
.pm49-office-nav nav{
  position:static !important;
  top:auto !important;
  left:auto !important;
  transform:none !important;
  grid-column:2 !important;
  justify-self:center !important;
  display:flex !important;
  align-items:center !important;
  gap:18px !important;
  width:auto !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
.pm49-office-nav nav a,
.pm49-office-brand,
.pm58-office-logo{
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
  backface-visibility:hidden;
}

/* Style 04: drop the bottom CTA a touch lower so it clears the nav arrow. */
.pm52-art-finale{
  padding-bottom:clamp(132px,14vw,210px) !important;
}
.pm60-art-cta{
  margin-top:62px !important;
}

/* Contact page refinement */
.pm62-contact-subcopy{
  max-width:760px !important;
  color:rgba(241,238,232,.80) !important;
}
.pm60-contact-hero p strong{ color:#fff; }
.pm62-contact-pill-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:30px;
}
.pm62-contact-pill-row span{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:0 16px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.035);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.pm62-intro-actions{ margin-top:20px; }
.pm62-inline-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:46px;
  padding:0 18px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.02);
  color:var(--fg) !important;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.pm62-inline-link:hover{ border-color:var(--accent); color:#fff !important; }
.pm62-fieldset-note{
  grid-column:1/-1;
  margin:-4px 0 8px;
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
}
.pm62-style-choice label > span{
  display:flex !important;
  flex-direction:column;
  gap:8px;
}
.pm62-style-choice b{
  margin-bottom:2px !important;
}
.pm62-style-choice em{
  display:block;
  font-style:normal;
  color:rgba(241,238,232,.82);
  font-size:12px;
  line-height:1.45;
  letter-spacing:.01em;
}
.pm62-direct-note{
  margin:0 0 34px;
  padding:22px 24px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.02);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.pm62-direct-note strong{
  display:block;
  margin-bottom:8px;
  font-size:18px;
  font-weight:600;
}
.pm62-direct-note p{
  margin:0;
  max-width:700px;
  color:var(--muted);
  font-size:13px;
  line-height:1.7;
}
.pm62-direct-note a{
  flex:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 18px;
  background:var(--accent-strong);
  color:#fff !important;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.pm62-request-grid select,
.pm60-request-form select{
  width:100%;
  border:1px solid var(--line);
  background:rgba(255,255,255,.025);
  color:var(--fg);
  font:inherit;
  padding:15px 16px;
  outline:none;
}
.pm60-request-form select:focus{ border-color:var(--accent); }
.pm62-feature-panel,
.pm62-color-panel{
  margin:22px 0 0;
  padding:22px 24px 24px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.015);
}
.pm62-feature-panel legend,
.pm62-color-panel legend{
  padding:0 8px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}
.pm62-check-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:8px;
}
.pm62-check-grid label{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:52px;
  padding:0 14px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.02);
  cursor:pointer;
}
.pm62-check-grid label span{
  margin:0 !important;
  font-size:13px !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  color:var(--fg) !important;
}
.pm62-check-grid input{
  width:16px;
  height:16px;
  accent-color:#2f5c53;
}
.pm62-color-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:8px;
}
.pm62-color-grid label{
  display:block;
}
.pm62-color-grid label > span{
  display:block;
  margin-bottom:10px;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}
.pm62-color-grid input[type="color"]{
  width:100%;
  height:54px;
  padding:6px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
}
.pm62-open-check{
  display:flex !important;
  align-items:center;
  gap:12px;
  margin-top:18px;
}
.pm62-open-check input{
  width:16px;
  height:16px;
  accent-color:#2f5c53;
}
.pm62-open-check span{
  margin:0 !important;
  color:var(--muted) !important;
  font-size:12px !important;
  letter-spacing:0 !important;
  text-transform:none !important;
}

@media(max-width:1120px){
  .pm49-office-nav{
    grid-template-columns:180px minmax(0,1fr) 180px !important;
  }
}
@media(max-width:980px){
  .pm62-direct-note{ flex-direction:column; align-items:flex-start; }
  .pm62-check-grid,
  .pm62-color-grid{ grid-template-columns:1fr; }
}
@media(max-width:700px){
  .pm62-contact-pill-row{ flex-direction:column; }
  .pm62-direct-note a,
  .pm62-inline-link{ width:100%; justify-content:center; }
  .pm49-office-nav{
    grid-template-columns:1fr !important;
    height:auto !important;
    gap:12px;
    padding:10px 20px 14px !important;
  }
  .pm49-office-brand,
  .pm49-office-nav nav{
    grid-column:auto !important;
    justify-self:start !important;
  }
  .pm49-office-nav nav{
    flex-wrap:wrap;
    gap:10px !important;
  }
}

/* Webdesign: an introduction in Noirin's own voice before the live examples. */
.pm43-intro.pm63-design-intro{
  min-height:calc(100svh - 126px);
  padding:50px 0 100px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.pm64-intro-topline{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:clamp(28px,5vw,80px);
}
.pm64-intro-cta{
  width:min(100%,460px);
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
  text-align:right;
}
.pm64-intro-cta > span{
  max-width:460px;
  color:rgba(241,238,232,.62);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  line-height:1.6;
  letter-spacing:.035em;
}
.pm64-intro-cta a{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  padding:0 19px;
  border:1px solid rgba(189,161,255,.42);
  background:rgba(159,123,255,.075);
  color:#f5f0ff;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  font-weight:500;
  letter-spacing:.07em;
  text-transform:uppercase;
  transition:background .25s ease,border-color .25s ease,transform .25s ease;
}
.pm64-intro-cta a b{
  color:var(--accent-strong);
  font-size:17px;
  font-weight:400;
  line-height:1;
}
.pm64-intro-cta a:hover{
  border-color:rgba(189,161,255,.76);
  background:rgba(159,123,255,.15);
  transform:translateY(-2px);
}
.pm64-intro-cta a:focus-visible{outline:2px solid var(--accent-strong);outline-offset:5px;}
.pm63-intro-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);
  gap:clamp(36px,6vw,110px);
  align-items:start;
  margin-top:clamp(46px,8vh,100px);
  padding-top:clamp(28px,4vw,50px);
  border-top:1px solid var(--line-strong);
}
.pm63-intro-grid h2{
  margin:0;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(46px,5.5vw,88px);
  line-height:.98;
  letter-spacing:-.045em;
  font-weight:400;
}
.pm63-intro-grid h2 em{
  font-weight:400;
  color:#bda1ff;
}
.pm63-intro-copy{
  max-width:590px;
  padding-top:4px;
}
.pm63-intro-copy p{
  margin:0 0 22px;
  color:rgba(241,238,232,.76);
  font-size:clamp(14px,1.08vw,16px);
  line-height:1.85;
  font-weight:300;
}
.pm63-intro-copy p:last-child{margin-bottom:0;}
.pm63-intro-copy strong{
  color:#f8f4ff;
  font-weight:600;
}
.pm63-scroll-cue{
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  gap:18px;
  margin-top:clamp(48px,7vh,100px);
  padding-bottom:12px;
  border-bottom:1px solid var(--accent-line);
  color:var(--fg);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.pm63-scroll-cue span{
  color:var(--accent-strong);
  font-size:20px;
  line-height:1;
  transition:transform .25s ease;
}
.pm63-scroll-cue:hover span{transform:translateY(5px);}
.pm63-scroll-cue:focus-visible{outline:2px solid var(--accent-strong);outline-offset:6px;}

/* JS only enables the long sticky sequence when motion is allowed. */
.pm63-immersion{
  position:relative;
  width:100vw;
  margin-left:calc(50% - 50vw);
  background:
    radial-gradient(ellipse at 34% 52%,rgba(112,76,199,.17),transparent 58%),
    linear-gradient(180deg,#17171b 0%,#18171d 9%,#1b1925 44%,#1c1927 58%,#19181f 86%,#17171b 100%);
}
.pm63-immersion.is-ready{height:var(--immersion-scroll-height,400svh);}
.pm63-immersion-sticky{
  min-height:100svh;
  display:grid;
  grid-template-columns:minmax(110px,.9fr) minmax(300px,1.55fr) minmax(110px,.9fr);
  grid-template-rows:minmax(0,1fr);
  align-items:center;
  column-gap:clamp(14px,2.5vw,48px);
  row-gap:clamp(18px,4vh,38px);
  padding:clamp(92px,12vh,138px) clamp(22px,4.5vw,82px) 34px;
  text-align:center;
  overflow:hidden;
}
.pm63-immersion.is-ready .pm63-immersion-sticky{
  position:sticky;
  top:0;
  height:100svh;
}
.pm63-immersion-words{
  grid-column:2;
  grid-row:1;
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:center;
  gap:clamp(1px,.4vh,6px);
  width:100%;
  height:clamp(360px,43vw,540px);
  margin:0;
  color:#f1eee8;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(56px,6.2vw,108px);
  font-weight:500;
  line-height:.82;
  letter-spacing:-.072em;
  text-align:center;
  pointer-events:none;
}
.pm63-immersion-words > span{
  width:max-content;
  max-width:100%;
  display:block;
  white-space:nowrap;
}
.pm63-immersion.is-ready .pm63-immersion-words > span{
  will-change:transform;
}
.pm63-immersion-gallery{
  grid-row:1;
  position:relative;
  display:grid;
  grid-template-rows:repeat(4,minmax(0,1fr));
  align-self:center;
  gap:clamp(10px,1.6vh,18px);
  width:100%;
  height:min(68vh,620px);
  overflow:hidden;
  z-index:1;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 9%,#000 91%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 9%,#000 91%,transparent 100%);
}
.pm63-immersion-gallery--left{grid-column:1;}
.pm63-immersion-gallery--right{grid-column:3;}
.pm63-immersion-slide{
  min-width:0;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
}
.pm63-immersion-slide img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:transparent;
}
.pm63-immersion.is-ready .pm63-immersion-gallery{
  display:block;
}
.pm63-immersion.is-ready .pm63-immersion-slide{
  position:absolute;
  inset:0 0 auto;
  width:100%;
  height:clamp(112px,18vh,190px);
  padding:0;
  border:0;
  border-radius:0;
  will-change:transform;
}
.pm43-preview-wrap{padding-top:clamp(110px,12vw,176px) !important;}

/* Give the italic title's upper strokes and i dots their full paint area. */
body.home-page{
  background:
    radial-gradient(circle at 50% -15%,rgba(255,255,255,.024),transparent 36%),
    radial-gradient(circle at 84% 9%,rgba(111,72,194,.075),transparent 27%),
    radial-gradient(circle at 16% 18%,rgba(88,58,158,.04),transparent 26%),
    #141419;
}
.home-page .hero{position:relative;}
.home-page .hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(ellipse at 50% 45%,rgba(104,66,181,.075),rgba(69,40,127,.02) 34%,transparent 70%);
}
.home-page .hero-center{position:relative;z-index:2;}
.home-page .hero-title{
  position:relative;
  line-height:1.04;
  padding:.12em .13em;
  margin-block:-.08em;
  overflow:visible;
}
.home-page .hero-title.is-letter-effect .effect-letter{
  display:inline-block;
  padding:.24em .14em .14em;
  margin:-.24em -.14em -.14em;
  vertical-align:baseline;
  overflow:visible;
  transition:none;
}
.home-page .hero-title .effect-letter.is-flickering{
  animation:noirinDisplayFlicker 560ms linear both;
}
@keyframes noirinDisplayFlicker{
  0%,100%{opacity:1;color:var(--accent-strong);text-shadow:none;}
  7%{opacity:1;color:#fff;text-shadow:0 0 9px rgba(255,255,255,.62),0 0 20px rgba(207,180,255,.34);}
  17%{opacity:.22;color:#f5efff;text-shadow:0 0 4px rgba(255,255,255,.20);}
  29%{opacity:.045;color:#fff;text-shadow:none;}
  43%{opacity:.88;color:#fff;text-shadow:0 0 7px rgba(255,255,255,.48);}
  52%{opacity:1;color:#fff;text-shadow:0 0 12px rgba(255,255,255,.72),0 0 25px rgba(211,184,255,.38);}
  66%{opacity:.07;color:#fff;text-shadow:none;}
  79%{opacity:.34;color:#f7f2ff;text-shadow:0 0 5px rgba(255,255,255,.24);}
  90%{opacity:1;color:#fff;text-shadow:0 0 8px rgba(255,255,255,.55);}
}
.home-page .hero-title.is-transparent{opacity:0;}
.home-page .hero-title::after{
  content:attr(data-word);
  position:absolute;
  left:50%;
  top:50%;
  z-index:2;
  color:#fff;
  font:inherit;
  line-height:inherit;
  letter-spacing:inherit;
  white-space:nowrap;
  opacity:0;
  transform:translate3d(-50%,-50%,0) scale(.99);
  pointer-events:none;
}
/* The word itself overexposes; the page behind it remains dark. */
.home-page .hero-title.glow-bloom{
  animation:noirinWordOverexposure var(--glow-duration,6000ms) cubic-bezier(.42,0,.58,1) forwards !important;
}
.home-page .hero-title.glow-bloom .effect-letter{
  color:inherit;
  text-shadow:inherit;
}
@keyframes noirinWordOverexposure{
  0%{color:var(--accent-strong);text-shadow:none;}
  28%{
    color:#d0b8ff;
    text-shadow:0 0 9px rgba(198,166,255,.30),0 0 24px rgba(166,116,255,.16);
  }
  58%{
    color:#fff;
    text-shadow:0 0 8px #fff,0 0 22px rgba(255,255,255,.92),0 0 48px rgba(218,194,255,.72),0 0 90px rgba(180,137,255,.40);
  }
  82%{
    color:#fff;
    text-shadow:0 0 12px #fff,0 0 30px #fff,0 0 62px rgba(255,255,255,.92),0 0 112px rgba(225,207,255,.64),0 0 170px rgba(184,141,255,.34);
  }
  100%{
    color:#fff;
    text-shadow:0 0 16px #fff,0 0 38px #fff,0 0 78px #fff,0 0 132px rgba(255,255,255,.90),0 0 205px rgba(222,201,255,.60);
  }
}
.home-page .hero-title.glow-bloom::after{
  animation:noirinOverexposedClone var(--glow-duration,6000ms) cubic-bezier(.42,0,.58,1) forwards;
}
@keyframes noirinOverexposedClone{
  0%,42%{opacity:0;filter:blur(0);transform:translate3d(-50%,-50%,0) scale(.99);}
  68%{opacity:.35;filter:blur(3px);transform:translate3d(-50%,-50%,0) scale(1.005);}
  86%{opacity:.72;filter:blur(7px);transform:translate3d(-50%,-50%,0) scale(1.025);}
  100%{opacity:1;filter:blur(13px);transform:translate3d(-50%,-50%,0) scale(1.055);}
}
/* Ten-second handwritten field around, but never over, the central composition. */
.noirin-trace-field{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:visible !important;
  pointer-events:none;
  contain:none;
}
.noirin-trace{
  position:absolute;
  left:var(--trace-x);
  top:var(--trace-y);
  display:block;
  width:max-content;
  opacity:.58;
  overflow:visible !important;
  transform:rotate(var(--trace-angle));
  transform-origin:left center;
  filter:none !important;
  contain:none;
  transition:opacity 3000ms ease-in;
}
.noirin-trace-writing,
.noirin-trace-glow{
  display:block;
  font-family:"Bodoni Moda",serif;
  font-size:var(--trace-size);
  font-style:italic;
  font-weight:500;
  line-height:1.05;
  letter-spacing:-.06em;
  white-space:nowrap;
}
.noirin-trace-writing{
  position:relative;
  z-index:2;
  color:rgba(213,194,255,.05);
  -webkit-text-stroke:.65px rgba(206,180,255,.62);
  -webkit-clip-path:inset(-20% 100% -20% 0);
  clip-path:inset(-20% 100% -20% 0);
  animation:noirinTraceWrite 1350ms cubic-bezier(.33,.02,.22,1) var(--trace-delay) forwards;
  transition:color 3000ms ease-in,-webkit-text-stroke-color 3000ms ease-in;
}
.noirin-trace-glow{
  position:absolute;
  inset:0 auto auto 0;
  z-index:1;
  width:max-content;
  color:rgba(255,255,255,0);
  -webkit-text-stroke:.7px rgba(255,255,255,0);
  opacity:0;
  overflow:visible !important;
  filter:none !important;
  contain:none;
  -webkit-clip-path:none !important;
  clip-path:none !important;
  text-shadow:none;
  transition:opacity 3000ms ease-in,color 3000ms ease-in,-webkit-text-stroke-color 3000ms ease-in,text-shadow 3000ms ease-in;
}
.noirin-trace::after{
  content:"";
  position:absolute;
  left:0;
  top:55%;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#efe5ff;
  opacity:0;
  box-shadow:0 0 7px #fff,0 0 15px rgba(192,154,255,.75);
  animation:noirinTraceTip 1350ms cubic-bezier(.33,.02,.22,1) var(--trace-delay) forwards;
}
@keyframes noirinTraceWrite{
  0%{-webkit-clip-path:inset(-20% 100% -20% 0);clip-path:inset(-20% 100% -20% 0);}
  100%{-webkit-clip-path:inset(-20% 0 -20% 0);clip-path:inset(-20% 0 -20% 0);}
}
@keyframes noirinTraceTip{
  0%{left:0;opacity:0;}
  8%{opacity:1;}
  92%{opacity:1;}
  100%{left:100%;opacity:0;}
}
.noirin-trace-field.is-brightening .noirin-trace{
  opacity:1;
  filter:none !important;
}
.noirin-trace-field.is-brightening .noirin-trace-writing{
  color:rgba(255,255,255,.88);
  -webkit-text-stroke-color:#fff;
  animation:none !important;
  -webkit-clip-path:none !important;
  clip-path:none !important;
}
.noirin-trace-field.is-brightening .noirin-trace-glow{
  opacity:1;
  color:rgba(255,255,255,.78);
  -webkit-text-stroke-color:rgba(255,255,255,.96);
  text-shadow:
    0 0 8px rgba(255,255,255,.98),
    0 0 20px rgba(255,255,255,.90),
    0 0 42px rgba(232,218,255,.76),
    0 0 78px rgba(205,176,255,.55),
    0 0 126px rgba(169,125,255,.34);
}
/* After a bloom the title vanishes transparently, then returns in four seconds. */
.home-page .hero-title.glow-reset-fade{
  animation:noirinReturnTransparent 4000ms ease-in-out forwards !important;
  text-shadow:none !important;
}
@keyframes noirinReturnTransparent{
  0%,12%{opacity:0;color:var(--accent-strong);}
  100%{opacity:1;color:var(--accent-strong);}
}

@media(max-width:900px){
  .pm63-intro-grid{grid-template-columns:1fr;gap:28px;}
  .pm63-intro-copy{max-width:720px;}
}
@media(max-width:700px){
  .pm43-intro.pm63-design-intro{
    min-height:auto;
    padding:30px 0 86px;
  }
  .pm63-intro-grid{margin-top:50px;}
  .pm64-intro-topline{
    flex-direction:column;
    gap:28px;
  }
  .pm64-intro-cta{
    width:100%;
    align-items:flex-start;
    text-align:left;
  }
  .pm64-intro-cta a{width:100%;justify-content:space-between;}
  .pm63-intro-grid h2{font-size:clamp(46px,11vw,74px);}
  .pm63-intro-copy p{font-size:14px;line-height:1.8;}
  .pm63-scroll-cue{margin-top:50px;}
  .pm63-immersion-sticky{
    grid-template-columns:minmax(58px,.72fr) minmax(170px,1.9fr) minmax(58px,.72fr);
    grid-template-rows:minmax(0,1fr);
    column-gap:6px;
    row-gap:14px;
    padding:82px 8px 24px;
  }
  .pm63-immersion-words{
    grid-column:2;
    grid-row:1;
    height:clamp(250px,40vh,340px);
    font-size:clamp(32px,8.6vw,64px);
  }
  .pm63-immersion-gallery{
    grid-row:1;
    height:min(62vh,470px);
  }
  .pm63-immersion-gallery--left{grid-column:1;}
  .pm63-immersion-gallery--right{grid-column:3;}
  .pm63-immersion.is-ready .pm63-immersion-slide{height:clamp(70px,13vh,112px);}
  .pm43-preview-wrap{padding-top:100px !important;}
  .home-page .hero-title{
    font-size:clamp(68px,25vw,140px);
    padding-inline:.12em;
  }
}
@media(prefers-reduced-motion:reduce){
  .pm63-scroll-cue span{transition:none;}
  .pm63-immersion.is-ready{height:auto;}
  .pm63-immersion.is-ready .pm63-immersion-sticky{position:relative;height:auto;}
  .pm63-immersion.is-ready .pm63-immersion-words{display:flex;overflow:visible;}
  .pm63-immersion.is-ready .pm63-immersion-words > span{
    position:static;
    transform:none !important;
  }
  .pm63-immersion.is-ready .pm63-immersion-gallery{display:grid;}
  .pm63-immersion.is-ready .pm63-immersion-slide{position:static;width:auto;height:auto;}
  .home-page .hero-title.glow-bloom,
  .home-page .hero-title.glow-reset-fade{animation:none !important;}
}

/* =========================================================
   v65 — clearer Webdesign CTAs and topic-based contact
   ========================================================= */
.pm64-intro-topline{
  justify-content:flex-end;
}
.pm64-intro-cta{
  width:min(100%,370px);
}
.pm64-intro-cta a{
  width:100%;
  min-height:50px;
  justify-content:space-between;
  padding-inline:21px;
}
.pm65-style-jump{
  border-color:rgba(241,238,232,.20) !important;
  background:rgba(255,255,255,.018) !important;
  color:rgba(245,240,255,.82) !important;
}
.pm65-style-jump:hover{
  border-color:rgba(189,161,255,.58) !important;
  background:rgba(159,123,255,.09) !important;
  color:#fff !important;
}
.pm63-scroll-cue{
  margin-top:clamp(78px,11vh,142px);
  gap:22px;
  padding-bottom:14px;
  font-size:clamp(14px,1.15vw,18px);
  font-weight:500;
  letter-spacing:.10em;
}
.pm63-scroll-cue span{
  font-size:26px;
}

.pm65-contact-benefits{
  --contact-gain:#73d49a;
  width:min(100%,780px);
  margin:clamp(58px,7vw,104px) 0 0 auto;
  text-align:left;
}
.pm65-benefits-label{
  display:block;
  margin-bottom:18px;
  color:var(--contact-gain);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  font-weight:600;
  letter-spacing:.17em;
  text-transform:uppercase;
}
.pm65-contact-benefits ul{
  margin:0;
  padding:0;
  list-style:none;
  border-top:1px solid var(--line);
}
.pm65-contact-benefits li{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:18px;
  align-items:start;
  padding:22px 0 24px;
  border-bottom:1px solid var(--line);
}
.pm65-benefit-plus{
  color:var(--contact-gain);
  font-family:"Space Grotesk",sans-serif;
  font-size:32px;
  font-weight:400;
  line-height:.8;
}
.pm65-contact-benefits li strong{
  display:block;
  color:#f8f6f1;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(18px,1.55vw,23px);
  font-weight:500;
  letter-spacing:-.025em;
}
.pm65-contact-benefits li p{
  max-width:650px;
  margin:7px 0 0;
  color:rgba(241,238,232,.64);
  font-size:13px;
  line-height:1.7;
}

.pm65-topic-choice{
  margin:0 0 42px;
  padding:0;
  border:0;
}
.pm65-topic-choice > legend{
  margin-bottom:12px;
  padding:0;
  color:var(--muted);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.pm65-topic-grid{
  display:grid;
  grid-template-columns:minmax(0,540px);
  gap:12px;
}
.pm65-topic-grid label{
  position:relative;
  display:block;
  cursor:pointer;
}
.pm65-topic-grid input{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  opacity:0;
  pointer-events:none;
}
.pm65-topic-grid label > span{
  display:grid !important;
  gap:8px;
  min-height:150px;
  margin:0 !important;
  padding:24px 26px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.018);
  color:var(--fg) !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  transition:border-color .22s ease,background .22s ease,transform .22s ease;
}
.pm65-topic-grid label:hover > span{
  transform:translateY(-2px);
  border-color:rgba(159,123,255,.46);
}
.pm65-topic-grid input:checked + span{
  border-color:var(--accent);
  background:rgba(159,123,255,.09);
  box-shadow:inset 0 0 0 1px rgba(159,123,255,.16);
}
.pm65-topic-grid input:focus-visible + span{
  outline:2px solid var(--accent-strong);
  outline-offset:4px;
}
.pm65-topic-grid small{
  color:var(--accent-strong);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.pm65-topic-grid strong{
  font-family:"Space Grotesk",sans-serif;
  font-size:25px;
  font-weight:500;
  letter-spacing:-.035em;
}
.pm65-topic-grid em{
  max-width:430px;
  color:rgba(241,238,232,.66);
  font-size:13px;
  font-style:normal;
  line-height:1.65;
}

@media(max-width:700px){
  .pm64-intro-topline{display:block;}
  .pm64-intro-cta{width:100%;}
  .pm63-scroll-cue{
    margin-top:70px;
    font-size:13px;
  }
  .pm65-contact-benefits{
    margin-top:54px;
  }
  .pm65-contact-benefits li{
    grid-template-columns:30px minmax(0,1fr);
    gap:12px;
  }
  .pm65-benefit-plus{font-size:28px;}
  .pm65-topic-grid{grid-template-columns:1fr;}
  .pm65-topic-grid label > span{min-height:0;padding:21px 20px;}
}

/* =========================================================
   v66 — aligned Webdesign intro + concise project briefing
   ========================================================= */

/* Webdesign: title and CTA pair share one calm visual line. */
.pm64-intro-topline{
  justify-content:space-between;
  align-items:flex-start;
}
.pm64-intro-topline > h1{
  flex:1 1 auto;
  margin:1px 32px 0 0;
}
.pm63-intro-grid{
  margin-top:clamp(52px,7vh,88px);
  padding-top:0;
  border-top:0;
}
.pm65-style-jump:hover{
  border-color:rgba(255,255,255,.94) !important;
  background:rgba(255,255,255,.075) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  color:#fff !important;
}
.pm65-style-jump:hover b{color:#fff !important;}

/* Contact: benefits sit directly below the headline without outer rules. */
.pm60-contact-hero{border-bottom:0;}
.pm65-contact-benefits{
  width:min(100%,820px);
  margin:clamp(46px,6vw,82px) 0 0;
}
.pm65-contact-benefits ul{border-top:0;}
.pm65-contact-benefits li:last-child{border-bottom:0;}

/* The briefing remains one page, but each short decision has its own rhythm. */
.pm66-form-promise{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:0 0 24px;
  padding:15px 18px;
  border:1px solid rgba(115,212,154,.24);
  background:rgba(115,212,154,.035);
  color:rgba(241,238,232,.68);
  font-size:12px;
  line-height:1.55;
}
.pm66-form-promise strong{
  color:#a4e4bc;
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  font-weight:600;
  letter-spacing:.10em;
  text-transform:uppercase;
}

.pm66-topic-choice{margin-bottom:22px;}
.pm66-topic-choice .pm65-topic-grid{grid-template-columns:minmax(0,1fr);}
.pm66-topic-choice .pm65-topic-grid label > span{
  grid-template-columns:minmax(120px,.36fr) minmax(0,1fr);
  grid-template-areas:"status title" "status copy";
  align-items:center;
  min-height:0;
  padding:18px 21px;
}
.pm66-topic-choice .pm65-topic-grid small{grid-area:status;}
.pm66-topic-choice .pm65-topic-grid strong{grid-area:title;font-size:21px;}
.pm66-topic-choice .pm65-topic-grid em{grid-area:copy;}

.pm66-brief-section{
  margin-top:22px;
  padding:clamp(24px,3.2vw,40px);
  border:1px solid var(--line);
  background:rgba(255,255,255,.014);
}
.pm66-section-heading{
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  gap:18px;
  align-items:start;
  margin-bottom:30px;
}
.pm66-section-heading > span{
  padding-top:7px;
  color:var(--accent-strong);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  font-weight:600;
  letter-spacing:.16em;
}
.pm66-section-heading h3{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(25px,2.7vw,38px);
  font-weight:500;
  line-height:1.04;
  letter-spacing:-.04em;
}
.pm66-section-heading p{
  margin:8px 0 0;
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
}

.pm66-question-block{
  min-width:0;
  margin:0 0 24px;
  padding:0;
  border:0;
}
.pm66-question-block:last-child{margin-bottom:0;}
.pm66-question-block > legend{
  margin-bottom:11px;
  padding:0;
  color:var(--muted);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:9px;
  font-weight:500;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.pm66-question-block > legend em{
  color:rgba(241,238,232,.42);
  font-style:normal;
  letter-spacing:.03em;
  text-transform:none;
}

.pm66-choice-grid{
  display:grid;
  gap:9px;
}
.pm66-choice-grid--three{grid-template-columns:repeat(3,minmax(0,1fr));}
.pm66-choice-grid--four{grid-template-columns:repeat(4,minmax(0,1fr));}
.pm66-choice-grid--images{grid-template-columns:repeat(5,minmax(0,1fr));}
.pm66-choice{
  position:relative;
  display:block;
  cursor:pointer;
}
.pm66-choice > input{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  opacity:0;
  pointer-events:none;
}
.pm60-request-form .pm66-choice > span{
  display:flex;
  align-items:center;
  min-height:64px;
  height:100%;
  margin:0;
  padding:13px 15px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.018);
  color:rgba(241,238,232,.78);
  font-family:"Manrope",system-ui,sans-serif;
  font-size:12px;
  font-weight:400;
  line-height:1.45;
  letter-spacing:0;
  text-transform:none;
  transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease;
}
.pm66-choice:hover > span{
  transform:translateY(-2px);
  border-color:rgba(241,238,232,.42);
  color:#fff;
}
.pm66-choice > input:checked + span{
  border-color:var(--accent-strong);
  background:rgba(159,123,255,.11);
  box-shadow:inset 0 0 0 1px rgba(159,123,255,.13);
  color:#fff;
}
.pm66-choice > input:focus-visible + span{
  outline:2px solid #fff;
  outline-offset:3px;
}

.pm66-two-column{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.pm60-request-form label > span em,
.pm66-timeframe > span em{
  color:rgba(241,238,232,.42);
  font-style:normal;
  letter-spacing:.02em;
  text-transform:none;
}
.pm66-two-column textarea{min-height:94px;resize:vertical;}
.pm66-existing-site{
  display:block;
  margin:0 0 24px;
  animation:pm66Reveal .25s ease both;
}
.pm66-existing-site[hidden]{display:none !important;}
@keyframes pm66Reveal{
  from{opacity:0;transform:translateY(-5px);}
  to{opacity:1;transform:translateY(0);}
}

.pm66-check-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
}
.pm66-check-grid label{
  display:flex;
  align-items:center;
  gap:11px;
  min-height:50px;
  padding:10px 13px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.015);
  cursor:pointer;
  transition:border-color .2s ease,background .2s ease;
}
.pm66-check-grid label:hover{border-color:rgba(241,238,232,.42);}
.pm60-request-form .pm66-check-grid input{
  flex:0 0 auto;
  width:16px;
  height:16px;
  margin:0;
  padding:0;
  accent-color:var(--accent-strong);
}
.pm60-request-form .pm66-check-grid label > span{
  display:block;
  margin:0;
  color:rgba(241,238,232,.78);
  font-family:"Manrope",system-ui,sans-serif;
  font-size:12px;
  font-weight:400;
  line-height:1.4;
  letter-spacing:0;
  text-transform:none;
}

.pm66-upload-note{
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  gap:13px;
  align-items:start;
  margin-top:25px;
  padding:17px 18px;
  border:1px solid rgba(115,212,154,.22);
  background:rgba(115,212,154,.028);
}
.pm66-upload-note > span{
  color:#73d49a;
  font-size:19px;
  line-height:1;
}
.pm66-upload-note p{
  margin:0;
  color:rgba(241,238,232,.62);
  font-size:12px;
  line-height:1.65;
}
.pm66-upload-note strong{color:#e9f9ef;font-weight:600;}

.pm66-optional-panel{
  margin-top:4px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.012);
}
.pm66-optional-panel summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  min-height:56px;
  padding:0 17px;
  color:rgba(241,238,232,.78);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  list-style:none;
}
.pm66-optional-panel summary::-webkit-details-marker{display:none;}
.pm66-optional-panel summary span{
  color:var(--accent-strong);
  font-size:22px;
  font-weight:300;
  transition:transform .22s ease;
}
.pm66-optional-panel[open] summary span{transform:rotate(45deg);}
.pm66-optional-panel .pm66-check-grid{
  padding:0 17px 17px;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.pm66-timeframe{
  display:block;
  max-width:520px;
  margin-top:22px;
}
.pm66-contact-section .pm60-request-grid{margin-top:0;}
.pm66-contact-section .pm60-request-full{margin-top:18px;}
.pm66-contact-section textarea{min-height:128px;resize:vertical;}

.pm60-request-form select{
  min-height:51px;
  color-scheme:dark;
}
.pm60-request-form input::placeholder,
.pm60-request-form textarea::placeholder{color:rgba(241,238,232,.34);}
.pm60-request-submit{
  margin-top:28px;
  padding-top:0;
  border-top:0;
}

@media(max-width:1100px){
  .pm66-choice-grid--images{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:900px){
  .pm66-choice-grid--three,
  .pm66-choice-grid--four,
  .pm66-choice-grid--images,
  .pm66-check-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:700px){
  .pm64-intro-topline{
    display:flex;
    flex-direction:column;
    gap:28px;
  }
  .pm64-intro-topline > h1{margin:0;}
  .pm63-intro-grid{margin-top:46px;}
  .pm65-contact-benefits{margin-top:42px;}
  .pm66-form-promise{
    align-items:flex-start;
    flex-direction:column;
    gap:4px;
  }
  .pm66-topic-choice .pm65-topic-grid label > span{
    display:grid !important;
    grid-template-columns:1fr;
    grid-template-areas:"status" "title" "copy";
  }
  .pm66-brief-section{padding:23px 17px;}
  .pm66-section-heading{grid-template-columns:31px minmax(0,1fr);gap:10px;}
  .pm66-two-column{grid-template-columns:1fr;}
  .pm66-choice-grid--images{grid-template-columns:1fr;}
  .pm66-optional-panel .pm66-check-grid{grid-template-columns:1fr;}
  .pm60-request-submit{align-items:stretch;}
}
@media(max-width:430px){
  .pm66-choice-grid--three,
  .pm66-choice-grid--four,
  .pm66-check-grid{grid-template-columns:1fr;}
  .pm60-request-form .pm66-choice > span{min-height:52px;}
}

/* =========================================================
   v67 — persistent style guide + dedicated contact topics
   Scoped to the new pages; example images retain their sizes.
   ========================================================= */
.webdesign-page .pm43-main{padding-top:108px;}
.webdesign-page .pm43-intro.pm63-design-intro{
  justify-content:flex-start;
  padding-top:16px;
  min-height:calc(100svh - 108px);
}
.webdesign-page .pm64-intro-topline{align-items:flex-start;}
.webdesign-page .pm64-intro-topline > h1{margin:0;}
.webdesign-page .pm64-intro-cta{
  flex:0 1 440px;
  width:min(100%,440px);
  gap:14px;
}
.webdesign-page .pm64-intro-cta a{
  min-height:64px;
  padding:16px 25px;
  font-size:clamp(12px,1.05vw,14px);
  letter-spacing:.045em;
  line-height:1.4;
  gap:20px;
}
.webdesign-page .pm64-intro-cta a b{font-size:25px;flex:none;}
.webdesign-page .pm65-style-jump b{color:var(--fg);}
.webdesign-page .pm65-style-jump:focus-visible{outline-color:#fff;}
.webdesign-page .pm63-intro-grid{
  grid-template-columns:minmax(0,.92fr) minmax(0,1fr);
  gap:clamp(40px,6vw,104px);
  margin-top:clamp(54px,9vh,96px);
  border:0;
}
.webdesign-page .pm63-intro-copy{max-width:590px;padding-top:0;}
.webdesign-page .pm63-intro-grid h2{
  max-width:650px;
  font-size:clamp(46px,5.3vw,82px);
  line-height:1.03;
  align-self:start;
}

/* A zero-height flow anchor keeps switching independent of sticky position. */
.pm67-toolbar-anchor{display:block;height:0;pointer-events:none;}
.pm67-style-toolbar{
  --style-button-bg:#2f5c53;
  --style-button-fg:#fff;
  --style-button-font:"Inter",sans-serif;
  position:sticky;
  top:var(--pm60-site-header-h,76px);
  z-index:36;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,auto);
  align-items:center;
  column-gap:32px;
  row-gap:12px;
  min-height:90px;
  padding:16px var(--pad);
  background:#17171b;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}
.webdesign-page .pm67-style-toolbar .pm47-style-traits{
  position:static !important;
  display:block !important;
  min-width:0;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1.2 !important;
  font-size:clamp(24px,2.15vw,36px);
}
.webdesign-page .style-craft-active .pm67-style-toolbar .pm47-style-traits,
.webdesign-page .style-office-active .pm67-style-toolbar .pm47-style-traits,
.webdesign-page .style-art-active .pm67-style-toolbar .pm47-style-traits{
  font-size:clamp(18px,1.7vw,27px) !important;
}
.pm67-style-cta{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:54px;
  max-width:100%;
  padding:14px 23px;
  border:1px solid var(--style-button-bg);
  background:var(--style-button-bg);
  color:var(--style-button-fg);
  font-family:var(--style-button-font);
  font-size:clamp(12px,.95vw,14px);
  font-weight:600;
  line-height:1.35;
  text-align:left;
  transition:transform .2s ease,box-shadow .2s ease;
}
.pm67-style-cta > b{flex:none;font-size:22px;font-weight:400;line-height:1;}
.pm67-style-cta:hover{transform:translateY(-2px);box-shadow:0 7px 18px rgba(0,0,0,.18);}
.pm67-style-cta:focus-visible{outline:2px solid #fff;outline-offset:4px;}
.style-craft-active .pm67-style-toolbar{--style-button-bg:#e33a32;}
.style-office-active .pm67-style-toolbar{--style-button-bg:#f3a51f;--style-button-fg:#103b69;}
.style-art-active .pm67-style-toolbar{
  --style-button-bg:#f5ff56;
  --style-button-fg:#090909;
  --style-button-font:"Syne","Bricolage Grotesque",sans-serif;
}

/* Example navigation pins below BOTH levels, never over the style guide. */
.webdesign-page .pm44-craft-nav,
.webdesign-page .pm49-office-nav,
.webdesign-page .pm43-sidebar-inner,
.webdesign-page .pm52-art-nav{
  top:calc(var(--pm60-site-header-h,76px) + var(--pm67-toolbar-h,90px)) !important;
}
.webdesign-page .pm52-art-nav{
  min-height:calc(100svh - var(--pm60-site-header-h,76px) - var(--pm67-toolbar-h,90px));
}
.webdesign-page .pm44-craft-nav.pm60-is-pinned::before,
.webdesign-page .pm49-office-nav.pm60-is-pinned::before{display:none !important;content:none !important;}
.webdesign-page .pm44-craft-nav nav,
.webdesign-page .pm49-office-nav nav{flex-wrap:wrap;}
.webdesign-page [data-style-slide] section[id]{
  scroll-margin-top:calc(var(--pm60-site-header-h,76px) + var(--pm67-toolbar-h,90px) + 110px);
}
.webdesign-page #website-immersion,
.webdesign-page #website-beispiele{scroll-margin-top:var(--pm60-site-header-h,76px);}

/* Topic landing page: real links work with and without JavaScript. */
.pm67-contact-topics{
  min-height:82svh;
  padding-top:clamp(132px,15vh,178px);
  padding-bottom:100px;
}
.pm67-topics-intro > small{
  display:block;
  margin-bottom:22px;
  color:var(--accent-strong);
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.pm67-topics-intro h1{
  max-width:1000px;
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(54px,7.2vw,108px);
  font-weight:500;
  line-height:1.02;
  letter-spacing:-.06em;
}
.pm67-topics-intro p{margin:24px 0 0;color:var(--muted);font-size:15px;line-height:1.65;}
.pm67-topic-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));
  gap:24px;
  max-width:900px;
  margin-top:clamp(36px,6vh,64px);
}
.pm67-topic-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding:clamp(26px,3vw,44px);
  border:1px solid rgba(189,161,255,.32);
  background:linear-gradient(125deg,rgba(159,123,255,.07),rgba(255,255,255,.015));
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.pm67-topic-card small{
  font-family:"Syne","Bricolage Grotesque",sans-serif;
  font-size:10px;
  letter-spacing:.08em;
  color:var(--muted);
}
.pm67-topic-card h2{
  margin:16px 0 12px;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(32px,4vw,54px);
  font-weight:500;
  line-height:1.05;
  letter-spacing:-.045em;
}
.pm67-topic-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.65;}
.pm67-topic-action{display:block;margin-top:27px;color:var(--accent-strong);font-size:13px;font-weight:500;}
.pm67-topic-arrow{flex:none;color:var(--accent-strong);font-size:42px;line-height:1;}
.pm67-topic-card:hover{border-color:var(--accent-strong);background:rgba(159,123,255,.09);transform:translateY(-3px);}
.pm67-topic-card:focus-visible{outline:2px solid var(--fg);outline-offset:5px;}
.pm67-topic-direct{margin:30px 0 0;color:var(--muted);font-size:12px;line-height:1.8;}
.pm67-topic-direct a{color:var(--fg);text-decoration:underline;text-underline-offset:4px;}

.webdesign-contact-page .pm60-contact-main{padding-top:118px;}
.webdesign-contact-page .pm60-contact-hero{padding-top:20px;padding-bottom:36px;}
.pm67-topic-back{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:44px;
  margin-bottom:28px;
  color:var(--muted);
  font-size:12px;
}
.pm67-topic-back:hover{color:var(--fg);}
.pm67-topic-back:focus-visible{outline:2px solid var(--fg);outline-offset:4px;}
.pm65-contact-benefits.pm67-benefits{width:min(100%,1000px);margin-top:42px;}
.pm67-benefits ul{display:grid;gap:17px;}
.pm65-contact-benefits.pm67-benefits li{
  grid-template-columns:28px minmax(0,1fr);
  align-items:center;
  gap:16px;
  padding:0;
  border:0;
}
.pm65-contact-benefits.pm67-benefits li strong{
  font-size:clamp(18px,1.7vw,26px);
  font-weight:700;
  line-height:1.35;
  letter-spacing:-.02em;
}
.webdesign-contact-page #project-request{scroll-margin-top:94px;}

@media(max-width:1000px){
  .webdesign-page .pm64-intro-topline{gap:28px;}
  .webdesign-page .pm64-intro-cta{flex-basis:395px;}
  .webdesign-page .pm64-intro-cta a{padding-inline:20px;font-size:12px;}
  .pm67-style-toolbar{column-gap:22px;}
  .pm67-style-cta{max-width:340px;padding:13px 17px;}
}
@media(max-width:800px){
  .webdesign-page .pm63-intro-grid{grid-template-columns:1fr;gap:34px;}
  .webdesign-page .pm63-intro-copy{max-width:660px;}
}
@media(max-width:700px){
  .webdesign-page .pm43-main{padding-top:102px;}
  .webdesign-page .pm43-intro.pm63-design-intro{min-height:0;padding-top:8px;}
  .webdesign-page .pm64-intro-cta{flex:0 1 auto;width:100%;}
  .webdesign-page .pm64-intro-cta a{min-height:62px;font-size:12px;padding-inline:20px;}
  .webdesign-page .pm63-intro-grid{margin-top:44px;}
  .webdesign-page .pm63-intro-grid h2{font-size:clamp(46px,10vw,66px);}
  .pm67-style-toolbar{grid-template-columns:1fr;padding:12px 20px;row-gap:9px;}
  .webdesign-page .pm67-style-toolbar .pm47-style-traits{font-size:23px;}
  .webdesign-page .style-craft-active .pm67-style-toolbar .pm47-style-traits,
  .webdesign-page .style-office-active .pm67-style-toolbar .pm47-style-traits,
  .webdesign-page .style-art-active .pm67-style-toolbar .pm47-style-traits{font-size:16px !important;}
  .pm67-style-cta{width:100%;max-width:none;min-height:46px;padding:11px 14px;font-size:12px;}
  /* Keep the mobile viewport for the example; only the style guide stays pinned. */
  .webdesign-page .pm44-craft-nav,
  .webdesign-page .pm49-office-nav,
  .webdesign-page .pm43-sidebar-inner,
  .webdesign-page .pm52-art-nav{position:relative !important;top:auto !important;min-height:0;}
  .webdesign-page .pm49-office-nav{height:auto !important;min-height:74px !important;}
  .webdesign-page [data-style-slide] section[id]{
    scroll-margin-top:calc(var(--pm60-site-header-h,76px) + var(--pm67-toolbar-h,112px) + 16px);
  }
  .pm67-contact-topics{padding-top:126px;padding-bottom:72px;min-height:75svh;}
  .pm67-topic-card{gap:18px;}
  .pm67-topic-arrow{font-size:30px;}
  .webdesign-contact-page .pm60-contact-main{padding-top:102px;}
  .webdesign-contact-page .pm60-contact-hero{padding-top:8px;}
  .pm67-topic-back{margin-bottom:20px;}
  .pm65-contact-benefits.pm67-benefits{margin-top:32px;}
  .pm65-contact-benefits.pm67-benefits li{grid-template-columns:20px minmax(0,1fr);gap:12px;}
  .pm65-contact-benefits.pm67-benefits .pm65-benefit-plus{font-size:27px;}
}
@media(prefers-reduced-motion:reduce){
  .pm67-style-cta,.pm67-topic-card{transition:none;}
}


/* =========================================================
   v67 — precision cleanup
   ========================================================= */

/* More natural default scale outside headings. */
body{
  font-size:14px;
}

/* Remove synthetic-looking decorative numbering without leaving empty layout. */
.workflow-symbol{
  width:54px;
  height:54px;
  border:1px solid rgba(241,238,232,.28);
  border-radius:50%;
  position:relative;
}
.workflow-symbol::before,
.workflow-symbol::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  background:rgba(241,238,232,.72);
  transform:translate(-50%,-50%);
}
.workflow-symbol::before{width:20px;height:1px;}
.workflow-symbol::after{width:1px;height:20px;}

.detail-list li{
  grid-template-columns:1fr !important;
  gap:0 !important;
}
.detail-list li > b{display:none !important;}

.pm44-service-row article > .pm72-service-mark{
  display:block;
  width:34px;
  height:2px;
  margin:0 0 20px;
  background:#e33a32;
}

/* During horizontal style changes, top-mounted example menus stay in flow.
   Sticky positioning comes back only when the new slide is settled. */
.webdesign-page .pm44-style-stage.is-switching .pm44-craft-nav,
.webdesign-page .pm44-style-stage.is-switching .pm49-office-nav{
  position:relative !important;
  top:0 !important;
  transform:none !important;
}

/* Accurate anchor landing. Side-menu examples do not need an extra top-nav offset. */
.webdesign-page [data-style-slide="soft"] section[id],
.webdesign-page [data-style-slide="art"] section[id]{
  scroll-margin-top:calc(var(--pm60-site-header-h,76px) + var(--pm67-toolbar-h,90px) + 20px) !important;
}
.webdesign-page [data-style-slide="craft"] section[id]{
  scroll-margin-top:calc(var(--pm60-site-header-h,76px) + var(--pm67-toolbar-h,90px) + 86px) !important;
}
.webdesign-page [data-style-slide="office"] section[id]{
  scroll-margin-top:calc(var(--pm60-site-header-h,76px) + var(--pm67-toolbar-h,90px) + 94px) !important;
}

/* Contact topic overview: website-standard body scale while keeping headings expressive. */
.contact-topics-page .pm67-contact-topics{
  width:min(100%,1180px);
  min-height:72svh;
  padding-top:clamp(112px,13vh,148px);
  padding-bottom:74px;
}
.contact-topics-page .pm67-topics-intro > small{font-size:9px;}
.contact-topics-page .pm67-topics-intro h1{
  font-size:clamp(46px,6vw,88px);
}
.contact-topics-page .pm67-topics-intro p{
  margin-top:18px;
  font-size:13px;
  line-height:1.65;
}
.contact-topics-page .pm67-topic-cards{
  max-width:760px;
  gap:18px;
  margin-top:38px;
}
.contact-topics-page .pm67-topic-card{
  padding:26px 28px;
  gap:22px;
}
.contact-topics-page .pm67-topic-card small{font-size:9px;}
.contact-topics-page .pm67-topic-card h2{
  margin:12px 0 8px;
  font-size:clamp(30px,3.2vw,44px);
}
.contact-topics-page .pm67-topic-card p{font-size:12.5px;}
.contact-topics-page .pm67-topic-action{margin-top:20px;font-size:11px;}
.contact-topics-page .pm67-topic-arrow{font-size:34px;}
.contact-topics-page .pm67-topic-direct{font-size:11px;}

/* Home: title + complete ellipse composition always fit the viewport.
   Width is constrained by both viewport width and viewport height. */
.home-page .hero{
  min-height:100svh;
  padding-top:clamp(88px,11svh,124px);
  padding-bottom:clamp(28px,5svh,54px);
}
.home-page .hero-center{
  width:100%;
  min-height:0 !important;
}
.home-page .hero-title{
  font-size:clamp(84px,min(17vw,21svh),240px);
  line-height:.78;
}
.home-page .hero-kicker{
  margin-top:clamp(18px,2.6svh,28px);
}
.home-page .ellipse-stage{
  width:min(92vw,78svh,800px);
  margin-top:clamp(12px,2.2svh,22px);
}
.home-page .hero-intro{
  max-width:560px;
  margin-top:clamp(18px,2.8svh,30px);
  font-size:12px;
  line-height:1.65;
}

@media(max-height:720px) and (min-width:700px){
  .home-page .hero{padding-top:82px;padding-bottom:24px;}
  .home-page .hero-title{font-size:clamp(92px,min(15vw,19svh),180px);}
  .home-page .ellipse-stage{width:min(70vw,66svh,680px);}
  .home-page .hero-intro{margin-top:14px;font-size:11px;}
}
@media(max-width:600px){
  .home-page .hero{padding-top:92px;padding-bottom:32px;}
  .home-page .hero-title{font-size:clamp(82px,min(28vw,19svh),138px);}
  .home-page .ellipse-stage{width:min(94vw,72svh);}
  .home-page .hero-intro{max-width:92vw;margin-top:18px;font-size:11.5px;}
}


/* =========================================================
   v68 — larger responsive home composition
   ========================================================= */
.home-page .hero{
  min-height:100svh;
  padding-top:clamp(84px,10svh,116px) !important;
  padding-bottom:clamp(22px,4svh,44px) !important;
}
.home-page .hero-title{
  font-size:clamp(94px,min(19.5vw,23svh),276px) !important;
  line-height:.78 !important;
}
.home-page .ellipse-stage{
  width:min(96vw,82svh,900px) !important;
  margin-top:clamp(10px,1.8svh,18px) !important;
}
.home-page .hero-intro{display:none !important;}

@media(max-height:720px) and (min-width:700px){
  .home-page .hero-title{
    font-size:clamp(94px,min(17vw,21svh),196px) !important;
  }
  .home-page .ellipse-stage{
    width:min(82vw,72svh,760px) !important;
  }
}
@media(max-width:600px){
  .home-page .hero-title{
    font-size:clamp(88px,min(30vw,21svh),148px) !important;
  }
  .home-page .ellipse-stage{
    width:min(97vw,77svh) !important;
  }
}

/* Generic accessibility helper for wizard legends. */
.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* v75 — sachliche Office-Typografie und echte Platzverteilung im Kunstbeispiel. */
.webdesign-page .pm49-office {font-family:"Manrope",system-ui,sans-serif;}
.webdesign-page .pm49-office :is(h2,h3,h4,p,small,label,input,textarea,select,button,a) {font-family:"Manrope",system-ui,sans-serif !important;}
.webdesign-page .pm49-office-nav {display:grid !important;grid-template-columns:auto minmax(0,1fr) !important;grid-template-rows:auto auto !important;height:auto !important;min-height:100px !important;gap:12px 28px !important;padding:16px clamp(20px,4vw,64px) !important;}
.webdesign-page .pm49-office-brand {grid-column:1;grid-row:1 / span 2;}
.webdesign-page .pm49-office-nav nav {grid-column:2;grid-row:2;justify-self:end;}
.pm75-office-details {grid-column:2;grid-row:1;display:flex;justify-content:flex-end;flex-wrap:wrap;gap:12px 24px;color:#fff;font:500 12px/1.5 "Manrope",sans-serif;}
.pm75-office-details > span {display:inline-flex;align-items:center;gap:8px;white-space:nowrap;}
.pm75-office-details svg {width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.webdesign-page .pm51-office-form label {font-size:14px;}
.webdesign-page .pm51-office-form :is(input,textarea,select) {font-size:16px;}

.webdesign-page .pm52-art-manifesto,
.webdesign-page .pm52-art-expression {grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:0;min-height:0;align-items:stretch;}
.webdesign-page .pm52-art-manifesto-copy,
.webdesign-page .pm52-art-expression-copy {min-width:0;container-type:inline-size;padding:clamp(48px,6vw,96px) clamp(24px,3.5vw,60px);}
.webdesign-page .pm52-art-manifesto-copy h3,
.webdesign-page .pm52-art-expression-copy h3 {font-size:clamp(38px,5.4vw,94px);line-height:1.08;letter-spacing:-.05em;max-width:100%;overflow-wrap:normal;hyphens:none;}
@supports(font-size:1cqi) {
  .webdesign-page .pm52-art-manifesto-copy h3 {font-size:clamp(32px,15cqi,94px);}
  .webdesign-page .pm52-art-expression-copy h3 {font-size:clamp(32px,14cqi,90px);}
}
.webdesign-page .pm52-art-expression-copy h3 > span {display:block;}
.webdesign-page .pm52-art-expression-copy h3 > span + span {margin-top:.32em;}
.webdesign-page .pm52-art-abstract,
.webdesign-page .pm52-art-expression figure {min-width:0;min-height:0;position:relative;}
.webdesign-page .pm52-art-abstract img,
.webdesign-page .pm52-art-expression figure img {position:absolute;inset:0;width:100%;height:100%;min-height:0;object-fit:cover;}
@media(max-width:1000px) {
  .webdesign-page .pm52-art-manifesto,
  .webdesign-page .pm52-art-expression {grid-template-columns:minmax(0,1fr);}
  .webdesign-page .pm52-art-abstract,
  .webdesign-page .pm52-art-expression figure {height:clamp(320px,65vw,600px);}
}
@media(max-width:700px) {
  .webdesign-page .pm49-office-nav {gap:12px !important;padding:12px 18px !important;}
  .pm75-office-details {font-size:11px;gap:6px;flex-direction:column;align-items:flex-end;}
  .webdesign-page .pm49-office-nav nav {grid-column:1/-1;grid-row:2;justify-self:stretch;justify-content:space-between;gap:10px;}
  .webdesign-page .pm49-office-brand {grid-row:1;}
}
/* Die geschlossene mobile Navigation darf keine Bildschirmhöhe belegen. */
@media(max-width:820px) {
  .topbar {backdrop-filter:none;min-height:72px;padding-block:16px;}
  .topbar .top-nav {position:fixed;inset:0;max-width:none;width:100%;height:100dvh;grid-column:auto;justify-self:stretch;}
  .topbar .menu-btn {grid-column:2;grid-row:1;justify-self:end;}
  .topbar .brand-anchor {grid-column:1;grid-row:1;}
  .topbar .top-nav:not(.open) {visibility:hidden;}
  .topbar .top-nav.open {visibility:visible;}
}
@media(prefers-reduced-motion:reduce) {
  .webdesign-page :is([data-scroll-reveal],[data-office-reveal],[data-art-reveal]) {opacity:1 !important;transform:none !important;transition:none !important;}
}


/* =========================================================
   v76 — restore previous side style arrows + black overscroll guard
   ========================================================= */

/* Safari/rubber-band overscroll must never reveal white above sticky menus. */
html{
  background:#0b0b0d;
}
body.webdesign-page{
  background-color:#17171b;
  overscroll-behavior-y:none;
}
.webdesign-page .topbar,
.webdesign-page .pm67-style-toolbar{
  background-color:#17171b !important;
}
.webdesign-page .topbar{
  box-shadow:0 -160px 0 #0b0b0d;
}
.webdesign-page .pm67-style-toolbar{
  box-shadow:
    0 -180px 0 #0b0b0d,
    0 6px 18px rgba(0,0,0,.08) !important;
}

/* The sample menus themselves also get a black guard above their sticky edge. */
.webdesign-page .pm44-craft-nav,
.webdesign-page .pm49-office-nav{
  box-shadow:0 -180px 0 #0b0b0d !important;
}