/* ============================================================
   MODX layer — styles for markup that comes from the CMS:
   old-site heading levels kept for SEO, breadcrumbs, rich-text TVs,
   AjaxForm messages, filters and the error pages.
   Loaded after style.css.
   ============================================================ */

/* ---------- headings kept from the old site (h2/h4 instead of h1/b) ---------- */
.mk .page-title{font-family:var(--display);font-weight:400;font-size:clamp(32px,4.4vw,56px);
  letter-spacing:-.02em;line-height:1.06;margin:14px 0 18px;max-width:22ch;text-wrap:balance;color:var(--text)}
.mk .sec-lead{color:var(--dim);font-size:15px;max-width:62ch;margin:10px 0 0}
.mk .page-head{padding-top:clamp(8px,1.4vw,20px);padding-bottom:0}
.mk .page-head .lead{max-width:72ch;font-size:16px}
.mk .page-head .lead p:first-of-type::first-letter{all:unset}

/* breadcrumbs — output of the Breadcrumb snippet: <ul id="breadcrumb"> */
.mk .crumbs ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 10px;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
.mk .crumbs li{display:flex;align-items:center;gap:10px}
.mk .crumbs li + li::before{content:"/";color:var(--line-2)}
.mk .crumbs a{color:var(--muted);transition:color .2s}
.mk .crumbs a:hover{color:var(--accent)}
.mk .rail .crumbs{margin-bottom:16px}

/* ---------- nav: pdoMenu output ---------- */
.mk .nav nav ul a.on{color:var(--accent-ink);background:var(--accent)}

/* ---------- cards ---------- */
.mk .card{display:flex;flex-direction:column}
.mk .card-body{display:flex;flex-direction:column;flex:1}
.mk .card .portfoliotype{order:3;margin:12px 0 0;padding-top:12px;border-top:1px solid var(--line);
  font-family:var(--ui);font-size:12.5px;font-weight:700;letter-spacing:.02em;line-height:1.35;color:var(--dim)}
.mk .card-top h4{margin:0;font-family:var(--display);font-variation-settings:"SOFT" 40,"opsz" 100;
  font-size:21px;font-weight:600;line-height:1.1;color:var(--text)}
.mk .card-body > p{order:2}
.mk .card-top{order:1}
.mk .card .card-cta{order:4;margin-top:auto;padding-top:12px;font-size:12px;font-weight:900;
  letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.mk .card:hover .card-cta{text-decoration:underline;text-underline-offset:4px}
.mk .bdg .bage:empty{display:none}
.mk .bdg span.bage{background:var(--accent);color:var(--accent-ink)}
.mk .shot img{object-position:50% 20%}

/* ---------- home ---------- */
.mk .hero h1.title{margin:0}
.mk .compo .tagcard{text-decoration:none;color:inherit;display:block}
.mk .step.single-service h3{font-size:21px}
.mk .about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(24px,4vw,64px);align-items:start}
.mk .about-grid .section-title h2{margin:0 0 16px;font-size:clamp(28px,3.4vw,46px);line-height:1.05}
.mk .about-grid .section-title p{color:var(--dim);margin:0 0 24px}
.mk .about-grid .section-title{position:sticky;top:110px}
.mk .about-grid .prose{max-width:none;font-size:16px}
.mk .about-grid .prose h3{margin-top:0}
.mk .prose img{display:inline-block;max-width:100%;height:auto}
.mk .quote .inner h2{margin:10px 0 14px;font-size:clamp(26px,3.2vw,42px);line-height:1.05}
.mk .quote .cta-text{display:block;margin:0 0 22px;font-family:var(--display);font-variation-settings:"SOFT" 50,"opsz" 130;
  font-size:clamp(17px,1.7vw,21px);line-height:1.5;color:var(--dim)}
.mk .quote .cta-text a,.mk .prose a,.mk .foot-cta-text a{color:var(--accent);text-decoration:underline;
  text-decoration-color:color-mix(in srgb,var(--accent) 45%,transparent);text-underline-offset:3px}
.mk .quote .cta-text strong{color:var(--text);font-weight:600}
.mk .prose strong{color:var(--text)}

/* ---------- news cards: old markup is article > img, h4, h4 > a ---------- */
.mk .ncard-img{display:flex;flex-direction:column;padding:10px 10px 22px}
.mk .ncard-img > *:not(.ncard-shot){margin-left:14px;margin-right:14px}
.mk .ncard-shot{display:block;aspect-ratio:16/10;border-radius:var(--r);overflow:hidden;background:var(--surface-2);margin-bottom:16px}
.mk .ncard-shot img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.16,.84,.24,1)}
.mk .ncard-img:hover .ncard-shot img{transform:scale(1.05)}
.mk .ncard .ncard-desc{font-family:var(--ui);font-size:13.5px;font-weight:400;color:var(--muted);line-height:1.55;margin:0 0 16px}
.mk .ncard .ncard-desc p{margin:0}
.mk .ncard .link-more{align-self:flex-start;margin-top:auto}
.mk .pagination{list-style:none;display:flex;gap:8px;padding:0;margin:26px 0 0}
.mk .pagination__item{border:1px solid var(--line-2);border-radius:999px;padding:7px 14px;font-weight:700;font-size:13px}
.mk .pagination__item.active{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}

/* ---------- article ---------- */
.mk .article-head .page-title{margin-top:18px}

/* ---------- model page ---------- */
.mk .rail h2.title,.mk .rail h1.title{margin:0;font-size:clamp(38px,3.4vw,54px);line-height:.98;font-weight:500}
.mk .rail .seo-tag{margin:6px 0 20px;font-family:var(--ui);font-size:14px;font-weight:700;color:var(--dim);line-height:1.4}
.mk .rail .seo-tag .star{color:var(--accent)}
.mk .bookcard h6{margin:0 0 12px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.mk .phone-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mk .phone-row .list-style--1{margin:0}
.mk .phone-row .list-style--1 li{border:0;padding:0;font-weight:700}
.mk .phone-row a{color:var(--accent)}
.mk .list-style--1{list-style:none;margin:0;padding:0}
.mk .list-style--1 li{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line);
  font-size:14.5px;color:var(--text)}
.mk .list-style--1 li:first-child{border-top:0}
.mk .list-style--1 li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.mk .list-style--1 li svg{display:none}
.mk #rn-appearance .list-style--1 li::before,.mk #rn-service .list-style--1 li::before{content:none}
.mk .list-style--1.rates li{font-family:var(--display);font-size:17px;font-weight:600;color:var(--accent)}
.mk .single-tab-content p{margin:0 0 12px;color:var(--dim);font-size:14px}
.mk .single-tab-content a{color:var(--accent)}
.mk .single-tab-content .list-style--1 li{color:var(--dim);font-size:14px}
.mk .mosaic .tile.p img{object-position:50% 20%}
.mk .tile.v video{background:var(--surface-2)}

/* ---------- forms (AjaxForm) ---------- */
.mk .form-wrapper{margin-top:clamp(18px,2.4vw,30px)}
.mk .form-col{display:grid;gap:16px;align-content:start}
.mk .form .field > span[class^="error_"],.mk .file-field > span[class^="error_"]{font-size:12.5px;color:#E7907C}
.mk .form .field > span[class^="error_"]:empty,.mk .file-field > span[class^="error_"]:empty{display:none}
.mk .form input.error,.mk .form textarea.error{border-color:#E7907C}
.mk .form-files{grid-template-columns:1fr!important}
.mk .file-drop .form-control{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mk .hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.mk .hp input,.mk input[name=work-email]{padding:0;margin:0;border:0!important;max-width:0;max-height:0}
.mk .alert{border-radius:var(--r-sm);padding:12px 16px;font-size:14px}
.mk .alert-success{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
.mk .alert-danger{background:rgba(231,144,124,.12);color:#E7907C}
.mk .description{font-size:16px}
.mk .contact-aside{display:grid;gap:16px;align-content:start}
.mk .contact-aside .thumbnail{overflow:hidden;aspect-ratio:4/5;background:transparent}
.mk .contact-aside .thumbnail img{width:100%;height:100%;object-fit:cover;mix-blend-mode:lighten;
  -webkit-mask-image:radial-gradient(ellipse 75% 70% at 60% 50%,#000 55%,transparent 100%);
  mask-image:radial-gradient(ellipse 75% 70% at 60% 50%,#000 55%,transparent 100%)}
.mk .contact-aside .pill-btn{justify-self:start}
.mk .rn-contact-area .section-title .page-title{margin-top:0}
/* jGrowl (AjaxForm notifications) in the dark theme */
.jGrowl .jGrowl-notification,.jGrowl .jGrowl-closer{background:#211D1A!important;color:#F3EEE9!important;
  border:1px solid #3B322C!important;border-radius:15px!important;font-family:"LatoW",system-ui,sans-serif!important;
  box-shadow:0 20px 40px -24px rgba(0,0,0,.9)!important;opacity:1!important}
.jGrowl .jGrowl-notification.af-message-success{border-color:#7FCBA3!important}
.jGrowl .jGrowl-notification.af-message-error{border-color:#E7907C!important}

/* ---------- filters ---------- */
.mk .fcount [data-count]{font-variant-numeric:tabular-nums}
.mk .opt .n{margin-left:6px;color:var(--muted);font-size:11px}
.mk .opt.on .n{color:inherit;opacity:.7}
.mk .opt.zero{opacity:.4}
.mk .empty-note{margin:26px 0 0;color:var(--dim);display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.mk .empty-note[hidden]{display:none}
.mk .card.is-hidden{display:none}

/* ---------- footers (both old variants) ---------- */
.mk .foot-call h2{margin:10px 0 22px;font-size:clamp(34px,4vw,56px);line-height:.98}
.mk .foot ul.ft-link + ul.ft-link{margin-top:22px}
.mk .foot-note{align-items:center}
.mk .foot-cta{text-align:center;max-width:760px;margin:0 auto clamp(30px,4vw,54px);
  padding-bottom:clamp(30px,4vw,54px);border-bottom:1px solid var(--line)}
.mk .foot-cta h2{margin:10px 0 14px;font-size:clamp(30px,3.6vw,48px);line-height:1.02}
.mk .foot-cta-text{display:block;color:var(--dim);margin:0 0 24px;font-size:16px}
.mk .foot-cta-text strong{color:var(--text)}
.mk .foot-grid-2{grid-template-columns:1fr 2.2fr;align-items:start}
.mk .foot-copy{margin:18px 0 16px;color:var(--muted);font-size:13px;letter-spacing:.06em}
.mk .footer-seo ul{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 22px}
.mk .footer-seo h3{margin:0;font-family:var(--ui);font-size:13.5px;font-weight:400;color:var(--dim);line-height:1.4}
.mk .footer-seo a:hover{color:var(--accent)}

/* ---------- error pages (404 / 401 / 503) ---------- */
.mk .hero.err{min-height:min(72vh,640px)}
.mk .err-code{display:block;font-size:clamp(96px,16vw,210px);line-height:.82;letter-spacing:-.05em;
  color:transparent;-webkit-text-stroke:1.5px var(--accent);font-weight:400}
.mk .err .page-title{margin:26px 0 10px}
.mk .err-text{color:var(--dim);max-width:46ch;font-size:16px}
.mk .err-text p{margin:0}
.mk .err .compo .big img{filter:grayscale(.35) brightness(.8)}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .mk .about-grid,.mk .foot-grid-2{grid-template-columns:1fr}
  .mk .about-grid .section-title{position:static}
  .mk .footer-seo ul{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .mk .footer-seo ul{grid-template-columns:1fr}
  .mk .contact-aside .thumbnail{display:none}
}

/* ---------- card links: image, name and "View escort" stay separate links
   (same anchors as the old site); the name link stretches over the card ---------- */
.mk .card{position:relative}
.mk .card .card-link::after{content:"";position:absolute;inset:0;z-index:4;border-radius:inherit}
.mk .card .shot-link{position:absolute;inset:0;display:block}
.mk .card .card-cta{position:relative;z-index:5;align-self:flex-start}
.mk .card-top .rate{white-space:nowrap}
.mk .rate .rate-l{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;opacity:.75;margin-right:4px}
.mk .card:hover .shot img{transform:scale(1.06)}
.mk .rail .seo-tag::before{content:"★";color:var(--accent);margin-right:6px}
.mk .bookcard .bk-title{margin:0 0 12px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}

.mk .logo{display:inline-flex;flex:none}
.mk .logo img{display:block;height:auto}
@media (max-width:560px){.mk .nav .logo img{width:104px}}
.mk .ncard-img .ncard-desc{margin:0 14px 16px}
.mk .ncard-img .link-more{margin-left:14px}
.mk a.load{display:table;width:auto;padding:14px 30px;text-align:center;text-decoration:none}
#jGrowl.top-right{top:96px!important;z-index:60!important}
.mk .form input,.mk .form textarea{scroll-margin-top:130px}
.mk .af-status{margin:0}
.mk .file-field.has-error .file-drop,.mk .file-field:has(span.error:not(:empty)) .file-drop{border-color:#E7907C}

/* ---------- mobile cards layout switch (1 / 2 per row) ---------- */
.mk .viewtoggle{display:none}
@media (max-width:760px){
  .mk .viewtoggle{display:flex;justify-content:flex-end;gap:6px;margin:0 0 12px}
  .mk .viewtoggle button{display:inline-flex;align-items:center;justify-content:center;width:38px;height:34px;
    border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--muted);cursor:pointer;padding:0}
  .mk .viewtoggle button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
  .mk .cards[data-view="1"]{grid-template-columns:1fr}
  .mk .cards[data-view="2"]{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .mk .cards[data-view="2"] .card{padding:5px;border-radius:var(--r)}
  .mk .cards[data-view="2"] .card-body{padding:9px 4px 4px}
  .mk .cards[data-view="2"] .card-top{flex-wrap:wrap;gap:4px}
  .mk .cards[data-view="2"] .card-top h4{font-size:17px}
  .mk .cards[data-view="2"] .rate{padding:3px 8px;font-size:11px}
  .mk .cards[data-view="2"] .rate .rate-l{display:none}
  .mk .cards[data-view="2"] .card p{font-size:11px;margin-top:4px}
  .mk .cards[data-view="2"] .portfoliotype{display:none}
  .mk .cards[data-view="2"] .card-cta{font-size:10.5px;padding-top:8px}
  .mk .cards[data-view="2"] .bdg{left:6px;top:6px}
  .mk .cards[data-view="2"] .bdg span{padding:4px 7px;font-size:8px}
  .mk .cards[data-view="2"] .vchip{font-size:0;gap:0;padding:6px 7px;right:6px;top:6px}
}

/* ---------- footer: same width as the page blocks (inset card, not full-bleed) ---------- */
.mk .foot{margin:clamp(20px,3vw,40px) clamp(16px,3vw,52px) 0;
  padding:clamp(32px,4vw,60px) clamp(24px,3.4vw,44px) 28px;
  border:1px solid var(--line);border-bottom:0}
@media (max-width:760px){
  .mk .foot{margin-left:clamp(12px,3vw,20px);margin-right:clamp(12px,3vw,20px);padding-left:20px;padding-right:20px}
}
@media (max-width:420px){
  .mk .foot{margin-left:10px;margin-right:10px;padding-left:16px;padding-right:16px}
}

/* ---------- mobile: never scroll the page sideways (iOS Safari ignores body-only / clip) ---------- */
@media (max-width:980px){
  html,body{overflow-x:hidden;max-width:100%}
  .mk .split,.mk .split > .mosaic,.mk .rail{max-width:100%;min-width:0}
}

/* ---------- card grids: columns may shrink below their content, never overflow ---------- */
.mk .cards > *{min-width:0}
@media (max-width:760px){
  .mk .cards:not([data-view="1"]){grid-template-columns:repeat(2,minmax(0,1fr))}
  .mk .card-top{flex-wrap:wrap;gap:4px 8px}
  .mk .card-top h4{min-width:0;overflow-wrap:anywhere}
}
@media (max-width:420px){
  .mk .cards:not([data-view="2"]){grid-template-columns:minmax(0,1fr)}
}
