/* CPS v1.1 — optional warm presentation. Existing editor colors remain editable.
   This sheet is loaded only for a draft or published page with design.style=warm. */
.cs-warm { --cs-shadow: 0 12px 40px #794a3910; }
.cs-warm .cs-header { background:var(--cs-bg); border-bottom-color:transparent; }
.cs-warm .cs-header-inner { min-height:94px; }
.cs-warm .cs-brand img { height:80px; }
.cs-warm .cs-nav { font-size:13px; gap:26px; }
.cs-warm .cs-account-link { border-radius:30px; background:var(--cs-surface); border-color:transparent; }
.cs-warm .cs-btn { border-radius:30px; padding:14px 25px; font-size:13px; min-height:49px; }
.cs-warm .cs-text-link { font-size:13px; }
.cs-warm .cs-eyebrow { font-size:11px; letter-spacing:1.9px; margin-bottom:19px; }
.cs-warm .cs-hero {
  width:100%; max-width:none; margin:0; position:relative; isolation:isolate;
  grid-template-columns:0.92fr 1.08fr; gap:54px; min-height:675px;
  padding:58px max(44px,calc((100% - var(--cs-width,1200px))/2)) 56px;
  background:var(--cs-surface);
  background:radial-gradient(ellipse at 13% 10%,color-mix(in srgb,var(--cs-pink) 8%,transparent),transparent 53%),
             radial-gradient(ellipse at 92% 90%,color-mix(in srgb,var(--cs-yellow) 11%,transparent),transparent 56%),var(--cs-surface);
  border-radius:0 0 52px 52px;
}
.cs-warm .cs-hero-copy { padding-bottom:16px; position:relative; z-index:2; }
.cs-warm .cs-hero h1 { font-size:clamp(48px,5.8vw,80px); line-height:1.04; letter-spacing:-2.8px; margin-bottom:25px; }
.cs-warm .cs-intro { font-size:17px; line-height:1.8; max-width:450px; margin-bottom:29px; }
.cs-warm .cs-signature { margin-top:32px; }
.cs-warm .cs-signature small { font-size:10px; letter-spacing:1.7px; }
.cs-warm .cs-signature>span { width:24px; height:24px; }
.cs-warm .cs-hero-art { position:relative; padding:8px 0; }
.cs-warm .cs-hero-art:before {
  content:''; position:absolute; inset:35px -16px 44px 32px;
  border:1px solid color-mix(in srgb,var(--cs-accent) 20%,transparent);
  border-radius:24px 125px 30px 70px; transform:rotate(3deg); z-index:-1;
}
.cs-warm .cs-art-main { height:335px; border-radius:16px 105px 16px 16px; overflow:hidden; box-shadow:var(--cs-shadow); }
.cs-warm .cs-art-main img { height:100%; width:100%; object-fit:cover; }
.cs-warm .cs-art-details { gap:16px; margin:15px 13px 0 0; }
.cs-warm .cs-art-details>div { height:153px; border:6px solid var(--cs-bg); border-radius:12px; box-shadow:0 10px 20px #794a3918; }
.cs-warm .cs-art-details>div:first-child { transform:rotate(-2deg); }
.cs-warm .cs-art-details>div:last-child { transform:rotate(2deg); }
.cs-warm .cs-image-caption { font-family:var(--cs-serif); font-size:14px; color:var(--cs-accent); margin:16px 6px 0; }
.cs-warm .cs-offerings-strip { background:transparent; border:0; padding:23px 0; }
.cs-warm .cs-offerings-strip span { font-size:10px; letter-spacing:1.3px; }
.cs-warm .cs-section { padding-block:78px; }
.cs-warm h2 { font-size:clamp(34px,3.3vw,47px); line-height:1.14; }
.cs-warm .cs-about-grid { grid-template-columns:0.84fr 1.08fr; gap:80px; align-items:center; }
.cs-warm .cs-about-image { aspect-ratio:1; border-radius:100px 18px 18px 18px; overflow:visible; background:var(--cs-surface); }
.cs-warm .cs-about-image img { width:100%; height:100%; border-radius:inherit; object-fit:cover; }
.cs-warm .cs-image-corner { inset:16px -12px -12px 16px; border-radius:100px 18px 18px 18px; border-color:var(--cs-border); z-index:-1; }
.cs-warm .cs-about-copy>p { font-size:15px; line-height:1.85; }
.cs-warm .cs-personal { border:0; padding:22px 26px; border-radius:16px; background:var(--cs-surface); margin-top:23px; }
.cs-warm .cs-personal h3 { font-size:14px; }
.cs-warm .cs-personal p { font-size:14px; line-height:1.8; }
.cs-warm .cs-personal .cs-closing { font-size:22px; line-height:1.45; color:var(--cs-accent); margin:13px 0 0; }
.cs-warm .cs-services { background:var(--cs-surface); border-radius:52px 52px 0 0; }
.cs-warm .cs-section-heading { grid-template-columns:1.1fr 0.9fr; gap:70px; align-items:end; margin-bottom:34px; }
.cs-warm .cs-section-heading>p { font-size:15px; line-height:1.85; max-width:460px; margin-bottom:4px; }
.cs-warm .cs-service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; border:0; background:none; }
.cs-warm .cs-service-card { padding:0 25px 26px; border:0; border-radius:20px; overflow:hidden; background:var(--cs-bg); box-shadow:0 5px 20px #794a3909; }
.cs-warm .cs-service-card:before { display:none; }
.cs-warm .cs-service-number { display:none; }
.cs-warm .cs-service-image { aspect-ratio:1.6; margin:0 -25px 23px; overflow:hidden; }
.cs-warm .cs-service-image img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.cs-warm .cs-service-card:hover .cs-service-image img { transform:scale(1.025); }
.cs-warm .cs-service-card h3 { font-size:25px; line-height:1.2; margin:22px 0 12px; }
.cs-warm .cs-service-card p { font-size:14px; line-height:1.8; }
.cs-warm .cs-service-cta { margin-top:38px; padding:30px 34px; border-radius:20px; background:var(--cs-bg); border:1px solid var(--cs-border); gap:30px; }
.cs-warm .cs-service-cta h3 { font-size:31px; }
.cs-warm .cs-service-cta p { font-size:14px; }
.cs-warm .cs-service-cta .cs-btn { background:var(--cs-accent); color:white!important; }
.cs-warm .cs-accounts { background:var(--cs-bg); padding-block:42px; border:0; }
.cs-warm .cs-accounts h2 { font-size:30px; }
.cs-warm .cs-accounts p:not(.cs-eyebrow) { font-size:14px; }
.cs-warm .cs-work-grid img { border-radius:18px; }
.cs-warm .cs-contact { background:var(--cs-surface); border-radius:52px 52px 0 0; }
.cs-warm .cs-contact-grid { grid-template-columns:0.85fr 1.15fr; gap:60px; align-items:start; }
.cs-warm .cs-contact-copy { padding-top:22px; }
.cs-warm .cs-contact-copy>p:not(.cs-eyebrow) { max-width:390px; font-size:16px; line-height:1.85; }
.cs-warm .cs-contact-details { grid-template-columns:1fr; gap:24px; }
.cs-warm .cs-contact-details>div:nth-child(3) { grid-column:auto; }
.cs-warm .cs-contact-details dt { font-size:11px; }
.cs-warm .cs-contact-details dd { font-size:15px; }
.cs-warm .cs-contact-form-area { background:var(--cs-bg); padding:32px; border-radius:24px; box-shadow:var(--cs-shadow); }
.cs-warm .cs-form-heading h3 { font-size:27px; }
.cs-warm .cs-form-heading>span { font-size:11px; }
.cs-warm .cs-form label { font-size:12px; }
.cs-warm .cs-form input:not([type=hidden]),.cs-warm .cs-form select,.cs-warm .cs-form textarea {
  border-radius:9px; background:var(--cs-bg); font-size:14px; min-height:46px;
}
.cs-warm .cs-form input[type=file] { font-size:12px; }
.cs-warm .cs-form input::file-selector-button { border-radius:6px; }
.cs-warm .cs-form .cs-help,.cs-warm .cs-form .cs-privacy { font-size:11px; line-height:1.65; }
.cs-warm .cs-footer { background:var(--cs-bg); border-color:var(--cs-border); }
.cs-warm .cs-footer-main { padding-block:30px; }
.cs-warm .cs-footer-brand img { width:126px; height:81px; }
.cs-warm .cs-footer nav { font-size:12px; }
.cs-warm .cs-media-note { font-size:10px; }
@media(min-width:1600px) { .cs-warm .cs-hero { min-height:710px; } .cs-warm .cs-art-main { height:345px; } }
@media(max-width:1100px) {
  .cs-warm .cs-nav { font-size:12px; gap:18px; }
  .cs-warm .cs-hero { gap:32px; min-height:590px; padding:44px 30px; }
  .cs-warm .cs-hero h1 { font-size:60px; }
  .cs-warm .cs-art-main { height:300px; }
  .cs-warm .cs-art-details>div { height:130px; }
  .cs-warm .cs-section { padding-block:65px; }
  .cs-warm .cs-about-grid { gap:44px; }
  .cs-warm .cs-contact-grid { gap:35px; }
  .cs-warm .cs-section-heading { gap:40px; }
  .cs-warm .cs-contact-form-area { padding:25px; }
  .cs-warm .cs-service-grid { gap:19px; }
}
@media(max-width:850px) {
  .cs-warm .cs-header-inner { min-height:80px; }
  .cs-warm .cs-brand img { height:66px; }
  .cs-warm .cs-nav { font-size:14px; }
  .cs-warm .cs-hero { grid-template-columns:0.94fr 1.06fr; gap:26px; padding:40px 30px; }
  .cs-warm .cs-hero h1 { font-size:50px; letter-spacing:-1.8px; }
  .cs-warm .cs-intro { font-size:15px; }
  .cs-warm .cs-art-main { height:265px; border-top-right-radius:75px; }
  .cs-warm .cs-art-details>div { height:108px; border-width:4px; }
  .cs-warm .cs-art-details { gap:10px; margin-right:0; }
  .cs-warm .cs-signature { margin-top:26px; }
  .cs-warm .cs-image-caption { font-size:12px; }
  .cs-warm .cs-service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cs-warm .cs-contact-grid { grid-template-columns:0.9fr 1.1fr; gap:27px; }
  .cs-warm .cs-contact-form-area { padding:23px; }
  .cs-warm .cs-form-row { grid-template-columns:1fr; }
  .cs-warm .cs-about-grid { grid-template-columns:0.8fr 1fr; gap:30px; }
  .cs-warm .cs-about-image { aspect-ratio:0.75; }
}
@media(max-width:600px) {
  .cs-warm .cs-brand img { width:min(var(--cs-logo),138px); height:68px; }
  .cs-warm .cs-hero { grid-template-columns:1fr; gap:26px; padding:35px 22px 29px; border-radius:0 0 30px 30px; }
  .cs-warm .cs-hero-copy { padding:0; }
  .cs-warm .cs-hero h1 { font-size:55px; line-height:1.03; letter-spacing:-2px; margin-bottom:20px; }
  .cs-warm .cs-eyebrow { font-size:10px; letter-spacing:1.5px; margin-bottom:16px; }
  .cs-warm .cs-intro { font-size:16px; line-height:1.75; margin-bottom:22px; }
  .cs-warm .cs-signature { margin-top:24px; }
  .cs-warm .cs-art-main { height:auto; aspect-ratio:1.52; border-top-right-radius:80px; }
  .cs-warm .cs-art-details>div { height:auto; aspect-ratio:1.68; border-width:5px; }
  .cs-warm .cs-hero-art:before { right:-8px; left:20px; }
  .cs-warm .cs-image-caption { font-size:13px; margin-top:13px; }
  .cs-warm .cs-offerings-strip { padding:21px 0; }
  .cs-warm .cs-offerings-strip span { font-size:9px; letter-spacing:0.7px; }
  .cs-warm .cs-section { padding-block:49px; }
  .cs-warm h2 { font-size:35px; }
  .cs-warm .cs-about-grid { gap:28px; }
  .cs-warm .cs-about-image { aspect-ratio:1.25; border-top-left-radius:80px; margin:0 9px 4px 0; }
  .cs-warm .cs-about-copy>p { font-size:15px; }
  .cs-warm .cs-personal { padding:21px; }
  .cs-warm .cs-personal .cs-closing { font-size:23px; }
  .cs-warm .cs-services,.cs-warm .cs-contact { border-radius:30px 30px 0 0; }
  .cs-warm .cs-section-heading { grid-template-columns:1fr; gap:14px; margin-bottom:25px; }
  .cs-warm .cs-section-heading>p { font-size:15px; }
  .cs-warm .cs-service-grid { grid-template-columns:1fr; gap:22px; }
  .cs-warm .cs-service-card { padding:0 23px 25px; }
  .cs-warm .cs-service-image { margin:0 -23px 21px; aspect-ratio:1.6; }
  .cs-warm .cs-service-card h3 { font-size:27px; margin-top:22px; }
  .cs-warm .cs-service-card p { font-size:15px; line-height:1.75; }
  .cs-warm .cs-service-cta { padding:25px; margin-top:26px; gap:19px; }
  .cs-warm .cs-service-cta h3 { font-size:29px; }
  .cs-warm .cs-accounts { padding-block:34px; }
  .cs-warm .cs-accounts h2 { font-size:29px; }
  .cs-warm .cs-contact-grid { grid-template-columns:1fr; gap:28px; }
  .cs-warm .cs-contact-copy { padding-top:0; }
  .cs-warm .cs-contact-copy>p:not(.cs-eyebrow) { font-size:15px; }
  .cs-warm .cs-contact-details { grid-template-columns:1fr; gap:20px; }
  .cs-warm .cs-contact-details dd { font-size:15px; }
  .cs-warm .cs-contact-form-area { padding:24px 20px; }
  .cs-warm .cs-form input:not([type=hidden]),.cs-warm .cs-form select,.cs-warm .cs-form textarea { font-size:16px; }
  .cs-warm .cs-form input[type=file] { font-size:12px; }
  .cs-warm .cs-form .cs-help,.cs-warm .cs-form .cs-privacy { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) { .cs-warm .cs-service-image img { transition:none; } .cs-warm .cs-service-card:hover .cs-service-image img { transform:none; } }

/* v1.2: show the complete new product collections without clipping the pen,
   cap, boxes or printer artwork. Existing selected image crops are unchanged. */
.cs-warm .cs-service-image img[src*="cps-assets/studio/services/"] {
  object-fit:contain;
  background:var(--cs-bg);
}
.cs-warm .cs-service-card:hover .cs-service-image img[src*="cps-assets/studio/services/"] {
  transform:none;
}