.tw-wd .tw-shell{width:min(calc(100% - (2 * var(--tw-gutter))),var(--tw-container));margin-inline:auto}\n.tw-wd h1,.tw-wd h2,.tw-wd h3{color:#071f36}.tw-wd p{line-height:1.55}.tw-wd-hero{position:relative;min-height:34rem;background-image:var(--wd-bg);background-size:cover;background-position:center;display:flex;align-items:center;color:#fff}.tw-wd-hero__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,22,39,.9) 0%,rgba(3,22,39,.66) 43%,rgba(3,22,39,.12) 75%)}.tw-wd-hero__inner{position:relative;z-index:1;padding-top:5rem;padding-bottom:5rem}.tw-wd-hero h1{color:#fff;font-size:clamp(2.8rem,5vw,5.25rem);line-height:.95;max-width:860px;margin:.45rem 0 1rem}.tw-wd-hero .tw-eyebrow{color:#fff}.tw-wd-lead{max-width:650px;font-size:1.08rem}.tw-wd-highlights{background:#fff;border-bottom:1px solid #e3eaf0}.tw-wd-highlights__grid{display:grid;grid-template-columns:repeat(4,1fr)}.tw-wd-highlights article{text-align:center;padding:1.65rem 1.5rem;border-right:1px solid #dce5ec}.tw-wd-highlights article:last-child{border:0}.tw-wd-highlights h3{font-size:1.05rem;margin:.6rem 0 .3rem}.tw-wd-highlights p{font-size:.9rem;margin:0;color:#536575}.tw-wd-icon{display:block;width:2.25rem;height:2.25rem;margin:auto;border:5px solid #159fe5;border-radius:7px;position:relative}.tw-wd-icon--code{border-radius:50%}.tw-wd-icon--mobile:after{content:'';position:absolute;width:13px;height:24px;border:3px solid #159fe5;right:-13px;bottom:-8px;background:#fff;border-radius:3px}.tw-wd-icon--growth{border-width:0;border-radius:0;background:linear-gradient(90deg,#159fe5 0 20%,transparent 20% 30%,#159fe5 30% 55%,transparent 55% 65%,#159fe5 65%);clip-path:polygon(0 100%,0 65%,20% 65%,20% 45%,55% 45%,55% 25%,100% 25%,100% 100%)}.tw-wd-strategy{padding:clamp(3rem,4.5vw,4.5rem) 0}.tw-wd-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,6vw,7rem);align-items:center}.tw-wd-media img,.tw-wd-work__image img{width:100%;height:auto;display:block}.tw-wd-copy h2,.tw-wd-work h2,.tw-wd-process h2,.tw-wd-faq h2{font-size:clamp(2.25rem,3.7vw,4rem);line-height:1}.tw-wd-checks{list-style:none;padding:0;margin:1.5rem 0}.tw-wd-checks li{font-weight:700;margin:.6rem 0;padding-left:1.8rem;position:relative}.tw-wd-checks li:before{content:'✓';position:absolute;left:0;top:0;width:1.25rem;height:1.25rem;border-radius:50%;background:#159fe5;color:#fff;text-align:center;line-height:1.25rem;font-size:.8rem}.tw-wd-process{padding:clamp(3rem,4.25vw,4.25rem) 0;background:#eef8ff}.tw-wd-process__intro{max-width:650px}.tw-wd-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:1.25rem;margin-top:2.5rem}.tw-wd-steps article{text-align:center;position:relative}.tw-wd-steps article>span{display:grid;place-items:center;margin:0 auto 1rem;width:3rem;height:3rem;border-radius:50%;background:#159fe5;color:#fff;font-weight:800;border:5px solid #ccecff}.tw-wd-steps h3{font-size:1rem;margin:.25rem}.tw-wd-steps p{font-size:.85rem;color:#536575}.tw-wd-work{padding:clamp(3rem,4.5vw,4.5rem) 0}.tw-wd-work__grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:4rem;align-items:center}.tw-wd-wp{display:grid;grid-template-columns:1fr 1fr;background:#071f36;color:#fff}.tw-wd-wp__media{min-height:27rem}.tw-wd-wp__media img{width:100%;height:100%;object-fit:cover;display:block}.tw-wd-wp__copy{padding:clamp(2.75rem,4.5vw,4.5rem);align-self:center}.tw-wd-wp h2{color:#fff;font-size:clamp(2.2rem,3.2vw,3.4rem);line-height:1.05}.tw-wd-wp .tw-eyebrow{color:#fff}.tw-wd-faq{padding:clamp(3rem,4.25vw,4.25rem) 0}.tw-wd-faq__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:5rem}.tw-wd-faqs details{border:1px solid #d9e3ea;margin-bottom:.55rem;border-radius:4px;background:#fff}.tw-wd-faqs summary{padding:1rem 3rem 1rem 1.25rem;cursor:pointer;font-weight:650;color:#173a58;position:relative;list-style:none}.tw-wd-faqs summary:after{content:'+';position:absolute;right:1.25rem;color:#159fe5;font-size:1.3rem}.tw-wd-faqs details[open] summary:after{content:'−'}.tw-wd-faqs details>div{padding:0 1.25rem 1rem;color:#536575}.tw-wd .tw-button{margin-top:1.25rem}.tw-button--outline{background:transparent!important;color:#159fe5!important;border:2px solid #159fe5!important}
@media(max-width:900px){.tw-wd-highlights__grid{grid-template-columns:repeat(2,1fr)}.tw-wd-split,.tw-wd-work__grid,.tw-wd-wp,.tw-wd-faq__grid{grid-template-columns:1fr}.tw-wd-steps{grid-template-columns:repeat(2,1fr)}.tw-wd-wp__media{min-height:22rem}.tw-wd-faq__grid{gap:2.5rem}}
@media(max-width:600px){.tw-wd-hero{min-height:31rem}.tw-wd-hero__shade{background:rgba(3,22,39,.72)}.tw-wd-hero h1{font-size:2.65rem}.tw-wd-highlights__grid,.tw-wd-steps{grid-template-columns:1fr}.tw-wd-highlights article{border-right:0;border-bottom:1px solid #dce5ec}.tw-wd-strategy,.tw-wd-work,.tw-wd-faq{padding:2.75rem 0}.tw-wd-process{padding:2.75rem 0}.tw-wd-copy h2,.tw-wd-work h2,.tw-wd-process h2,.tw-wd-faq h2{font-size:2.35rem}.tw-wd-wp__copy{padding:2.75rem var(--tw-gutter)}}


/* v1.1.10 — full-bleed split sections: media owns the viewport edge; copy owns the gutter. */
@media (min-width:901px){
  .tw-wd-strategy{padding:0}
  .tw-wd-strategy .tw-wd-split{gap:0;align-items:stretch}
  .tw-wd-strategy .tw-wd-media{min-height:30rem}
  .tw-wd-strategy .tw-wd-media img{width:100%;height:100%;object-fit:cover}
  .tw-wd-strategy .tw-wd-copy{align-self:center;padding:clamp(3rem,4.5vw,4.5rem) max(var(--tw-gutter),calc((100vw - var(--tw-container))/2 + var(--tw-gutter))) clamp(3rem,4.5vw,4.5rem) clamp(3rem,6vw,7rem)}

  .tw-wd-work{padding:0}
  .tw-wd-work__grid{gap:0;align-items:stretch}
  .tw-wd-work__grid>div:first-child{align-self:center;padding:clamp(3rem,4.5vw,4.5rem) clamp(3rem,6vw,7rem) clamp(3rem,4.5vw,4.5rem) max(var(--tw-gutter),calc((100vw - var(--tw-container))/2 + var(--tw-gutter)))}
  .tw-wd-work__image{min-height:28rem}
  .tw-wd-work__image img{width:100%;height:100%;object-fit:cover}
}

/* Process and FAQ are not image splits, so their content retains normal page gutters. */
.tw-wd-process>.tw-shell,.tw-wd-faq>.tw-shell{width:min(calc(100% - (2 * var(--tw-gutter))),var(--tw-container));margin-inline:auto}

@media(max-width:900px){
  .tw-wd-strategy .tw-wd-split,.tw-wd-work__grid{gap:0}
  .tw-wd-strategy .tw-wd-copy,.tw-wd-work__grid>div:first-child{padding:2.75rem var(--tw-gutter)}
  .tw-wd-strategy .tw-wd-media,.tw-wd-work__image{width:100%}
}


/* v1.1.11 — precision pass from approved concept. Hero/highlights remain untouched. */
@media (min-width:901px){
  /* Strategy: keep media flush left, but let copy use its half like the WordPress panel. */
  .tw-wd-strategy .tw-wd-copy{
    padding:clamp(2.75rem,4vw,4rem) clamp(2.75rem,4.5vw,4.5rem);
  }

  /* Process: full-width band with a controlled inner composition and CTA in the heading row. */
  .tw-wd-process{padding:2.75rem 0 3rem}
  .tw-wd-process>.tw-shell{width:min(calc(100% - (2 * var(--tw-gutter))),76rem)}
  .tw-wd-process__head{display:flex;align-items:center;justify-content:space-between;gap:3rem}
  .tw-wd-process__head>div{max-width:42rem}
  .tw-wd-process__head .tw-button{flex:0 0 auto;margin-top:0}
  .tw-wd-steps{gap:2.25rem;margin-top:2.1rem}
  .tw-wd-steps article:not(:last-child)::after{content:'→';position:absolute;top:.65rem;right:-1.55rem;color:#9cc8e4;font-size:1.4rem;font-weight:400}

  /* Featured Work: editorial text inset on the left; collage gets the full right side without forced cropping. */
  .tw-wd-work{padding:0;background:#fff}
  .tw-wd-work__grid{grid-template-columns:47% 53%;gap:0;min-height:23rem;align-items:center}
  .tw-wd-work__grid>div:first-child{padding:3rem clamp(2.5rem,5vw,5rem) 3rem max(var(--tw-gutter),calc((100vw - 80rem)/2 + var(--tw-gutter)))}
  .tw-wd-work__image{min-height:0;height:100%;display:flex;align-items:center;justify-content:flex-end;overflow:hidden}
  .tw-wd-work__image img{width:100%;height:auto;max-height:24rem;object-fit:contain;object-position:right center}

  /* WordPress is the split-section padding reference. */
  .tw-wd-wp__copy{padding:clamp(2.75rem,4vw,4rem) clamp(2.75rem,4.5vw,4.5rem)}

  /* FAQ: centered, deliberate inner width instead of viewport-edge columns. */
  .tw-wd-faq{padding:3rem 0 3.25rem}
  .tw-wd-faq>.tw-shell{width:min(calc(100% - (2 * var(--tw-gutter))),76rem)}
  .tw-wd-faq__grid{grid-template-columns:.9fr 1.25fr;gap:4.5rem;align-items:start}
}

@media(max-width:900px){
  .tw-wd-process__head{display:block}
  .tw-wd-process__head .tw-button{margin-top:1.25rem}
  .tw-wd-work__image{min-height:0}
  .tw-wd-work__image img{height:auto;object-fit:contain}
}

/* v1.1.12 — restore true full-width lower-page compositions while keeping readable gutters. */
@media (min-width:901px){
  /* Process: full viewport composition; only the content itself receives edge breathing room. */
  .tw-wd-process>.tw-shell{
    width:100%;
    max-width:none;
    padding-inline:clamp(var(--tw-gutter),4vw,4.5rem);
    box-sizing:border-box;
  }
  .tw-wd-process__head>div{max-width:46rem}
  .tw-wd-steps{width:100%;gap:clamp(1.5rem,2.5vw,3rem)}

  /* Featured Work: true edge-to-edge section. Text gets a gutter; artwork owns the right edge. */
  .tw-wd-work{width:100%}
  .tw-wd-work__grid{width:100%;max-width:none;grid-template-columns:45% 55%}
  .tw-wd-work__grid>div:first-child{
    padding:3rem clamp(2.5rem,5vw,5rem) 3rem clamp(var(--tw-gutter),4vw,4.5rem);
  }
  .tw-wd-work__image{width:100%;justify-content:flex-end}
  .tw-wd-work__image img{width:100%;max-width:none;object-position:right center}

  /* FAQ: full viewport composition with sensible content gutters, not a centered max-width box. */
  .tw-wd-faq>.tw-shell{
    width:100%;
    max-width:none;
    padding-inline:clamp(var(--tw-gutter),4vw,4.5rem);
    box-sizing:border-box;
  }
  .tw-wd-faq__grid{grid-template-columns:.85fr 1.15fr;gap:clamp(3rem,6vw,7rem)}
}


/* v1.1.15 — Web Design finishing pass only.
   Process + FAQ use the same horizontal shell treatment as Highlights.
   Featured Work gives the supplied artwork more visual weight. */
@media (min-width:901px){
  .tw-wd .tw-wd-process > .tw-shell,
  .tw-wd .tw-wd-faq > .tw-shell{
    width:min(calc(100% - (2 * var(--tw-gutter))),var(--tw-container));
    max-width:var(--tw-container);
    padding-inline:0;
    margin-inline:auto;
    box-sizing:border-box;
  }

  .tw-wd .tw-wd-work__grid{
    grid-template-columns:40% 60%;
    min-height:27rem;
  }

  .tw-wd .tw-wd-work__grid > div:first-child{
    padding-right:clamp(2rem,3.5vw,4rem);
  }

  .tw-wd .tw-wd-work__image{
    min-height:27rem;
    overflow:visible;
    display:flex;
    align-items:center;
    justify-content:flex-end;
  }

  .tw-wd .tw-wd-work__image img{
    width:112%;
    max-width:none;
    max-height:none;
    height:auto;
    object-fit:contain;
    object-position:right center;
  }
}

@media (max-width:900px){
  .tw-wd .tw-wd-work__image img{
    width:100%;
    max-width:none;
    height:auto;
  }
}


/* v1.1.16 — Featured Work final layout pass only.
   True 50/50 desktop split + subtle 8px separation above/below the section. */
.tw-wd .tw-wd-work{
  margin-block:8px;
}

@media (min-width:901px){
  .tw-wd .tw-wd-work__grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }

  .tw-wd .tw-wd-work__grid > div:first-child{
    padding-right:clamp(2rem,3vw,3.5rem);
  }

  .tw-wd .tw-wd-work__image{
    width:100%;
    min-width:0;
  }

  .tw-wd .tw-wd-work__image img{
    width:100%;
    max-width:100%;
    height:auto;
    object-fit:contain;
    object-position:center;
  }
}


/* v1.2.4: refined Web Design highlight icons — Custom Design + Clean Code only */
.tw-wd-icon--design,
.tw-wd-icon--code{
  border:0;
  border-radius:0;
  background:transparent;
}
.tw-wd-icon--design:before{
  content:'';
  position:absolute;
  left:4px;
  top:14px;
  width:27px;
  height:7px;
  background:#159fe5;
  border-radius:2px;
  transform:rotate(-45deg);
  transform-origin:center;
}
.tw-wd-icon--design:after{
  content:'';
  position:absolute;
  left:25px;
  top:3px;
  width:0;
  height:0;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  border-left:8px solid #159fe5;
  transform:rotate(-45deg);
  transform-origin:center;
}
.tw-wd-icon--code:before,
.tw-wd-icon--code:after{
  position:absolute;
  top:4px;
  color:#159fe5;
  font-family:Arial,sans-serif;
  font-size:27px;
  line-height:27px;
  font-weight:700;
}
.tw-wd-icon--code:before{content:'<';left:0}
.tw-wd-icon--code:after{content:'>';right:0}
.tw-wd-icon--code{
  background:linear-gradient(105deg,transparent 45%,#159fe5 46%,#159fe5 54%,transparent 55%);
  background-size:10px 30px;
  background-repeat:no-repeat;
  background-position:center;
}

/* v1.2.5: restore approved Web Design highlight icon set — first two icons */
.tw-wd-icon--design,
.tw-wd-icon--code{
  width:2.55rem;
  height:2.55rem;
  border:0;
  border-radius:0;
  background-color:transparent;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
}
.tw-wd-icon--design:before,
.tw-wd-icon--design:after,
.tw-wd-icon--code:before,
.tw-wd-icon--code:after{
  content:none;
  display:none;
}
.tw-wd-icon--design{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='%23159fe5'%3E%3Crect x='7' y='8' width='50' height='36' rx='4'/%3E%3Crect x='12' y='13' width='40' height='26' rx='1' fill='white'/%3E%3Crect x='28' y='44' width='8' height='7'/%3E%3Crect x='20' y='51' width='24' height='5' rx='2'/%3E%3C/g%3E%3C/svg%3E");
}
.tw-wd-icon--code{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23159fe5' d='M57.7 36.7v-9.4l-7-1.8a20 20 0 0 0-1.9-4.5l3.7-6.2-6.6-6.6-6.2 3.7a20 20 0 0 0-4.5-1.9l-1.8-7h-9.4l-1.8 7a20 20 0 0 0-4.5 1.9l-6.2-3.7-6.6 6.6 3.7 6.2a20 20 0 0 0-1.9 4.5l-7 1.8v9.4l7 1.8a20 20 0 0 0 1.9 4.5l-3.7 6.2 6.6 6.6 6.2-3.7a20 20 0 0 0 4.5 1.9l1.8 7h9.4l1.8-7a20 20 0 0 0 4.5-1.9l6.2 3.7 6.6-6.6-3.7-6.2a20 20 0 0 0 1.9-4.5l7-1.8ZM28.7 42.8a10.8 10.8 0 1 1 0-21.6 10.8 10.8 0 0 1 0 21.6Z'/%3E%3C/svg%3E");
}

/* v1.2.20 typography consistency */
.tw-wd .tw-wd-hero h1,.tw-wd h2{font-weight:850}.tw-wd .tw-wd-hero .tw-eyebrow{color:#8fd4fb;font-weight:850;letter-spacing:.22em}
