/* Knysna Catamarans brand page (page-knysna-catamarans.php). Loads after windelo-54.css and knysna-550.css. Scoped to .kc. */

/* photos */
.w54.kc .hero{background:#141a3c}
.w54.kc .hero::before{background:url(/wp-content/uploads/2025/12/Knysna-550-catamaran-BLUE-JACKET-2-sea-trial-9.jpg) 50% 50%/cover no-repeat;left:auto;width:64%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 38%);mask-image:linear-gradient(90deg,transparent 0,#000 38%)}
@media (max-width:760px){.w54.kc .hero::before{left:0;width:100%;background-position:50% 40%;-webkit-mask-image:none;mask-image:none}.w54.kc .hero::after{background:linear-gradient(0deg,rgba(18,20,56,.92) 0%,rgba(18,20,56,.65) 50%,rgba(18,20,56,.2) 80%)}}
.w54.kc .band::before{background-image:url(/wp-content/uploads/2023/06/Knysna-Yacht-Company-and-Just-Catamarans.jpg);background-position:center 50%}
.w54.kc .fig-n{white-space:nowrap}

/* model cards: whole card is a link */
.kc .kc-models{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:40px}
@media (max-width:760px){.kc .kc-models{grid-template-columns:1fr}}
.kc .kc-model{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:6px;overflow:hidden;text-decoration:none;color:inherit;transition:border-color .2s ease,box-shadow .2s ease}
.kc .kc-model:hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.kc .kc-model-img{aspect-ratio:3/2;overflow:hidden;background:var(--bg)}
.kc .kc-model-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.kc .kc-model:hover .kc-model-img img{transform:scale(1.03)}
.kc .kc-model-body{display:flex;flex-direction:column;gap:12px;padding:24px 26px 26px;flex:1}
.kc .kc-model h3{font-size:30px;font-stretch:120%}
.kc .kc-model p{color:var(--muted);font-size:15.5px}
.kc .kc-model-specs{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0;padding:12px 0 0;border-top:1px solid var(--line);list-style:none;font-family:var(--f-mono);font-size:13px;color:var(--ink)}
.kc .kc-model-specs li{margin:0;padding:0}
.kc .kc-model-more{margin-top:auto;padding-top:6px;font:600 14.5px/1.3 var(--f-body);color:var(--accent-ink)}
.kc .kc-model-more span{border-bottom:2px solid var(--accent)}

/* 500SE vs 550 comparison on the navy plate (dd values switch with the unit toggle) */
.w54 .spec-grid.kc-compare{display:block;margin-top:40px;max-width:900px}
.kc .kc-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);gap:16px;margin:0;padding:12px 0;border-bottom:1px solid var(--plate-line);align-items:baseline}
.kc .kc-row dt{color:var(--plate-muted);font-size:15px}
.kc .kc-row dd{margin:0;font-family:var(--f-mono);font-size:14.5px;font-variant-numeric:tabular-nums}
.kc .kc-head{border-bottom-color:var(--accent);padding-bottom:10px}
.kc .kc-head span{font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.kc .kc-src{font-family:var(--f-mono);font-size:12px;letter-spacing:.04em;color:var(--plate-muted);margin-top:18px}
@media (max-width:520px){.kc .kc-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:4px}.kc .kc-row dt{grid-column:1/-1}.kc .kc-head span:first-child{display:none}}

/* why Knysna */
.kc .kc-traits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:40px}
@media (max-width:900px){.kc .kc-traits{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.kc .kc-traits{grid-template-columns:1fr}}
.kc .kc-trait{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:6px;padding:22px 22px 24px}
.kc .kc-trait h3{font-size:19px;margin-bottom:10px}
.kc .kc-trait p{color:var(--muted);font-size:15px;line-height:1.5}

/* shipyard photos */
.kc .kc-yard{display:grid;grid-template-columns:1fr;gap:10px}
.kc .kc-yard a{display:block;cursor:zoom-in;border-radius:4px;overflow:hidden}
.kc .kc-yard img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .6s ease}
.kc .kc-yard a:hover img{transform:scale(1.03)}
@media (min-width:861px){.kc .split.rev .kc-yard{order:2}}

/* film header button */
.kc #film .plate-head{align-items:end}

/* news */
.kc .alt{background:var(--surface);border-block:1px solid var(--line)}
.kc .kc-news{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
@media (max-width:860px){.kc .kc-news{grid-template-columns:1fr}}
.kc .kc-news-card{display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line);border-radius:6px;overflow:hidden;text-decoration:none;color:inherit;transition:border-color .2s ease,box-shadow .2s ease}
.kc .kc-news-card:hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.kc .kc-news-img{aspect-ratio:16/10;overflow:hidden;background:var(--line)}
.kc .kc-news-img img{width:100%;height:100%;object-fit:cover}
.kc .kc-news-body{display:flex;flex-direction:column;gap:10px;padding:20px 22px 22px;flex:1}
.kc .kc-news-body h3{font-size:19px;line-height:1.25}

.kc .jc-form-msg{margin-top:16px;padding:12px 16px;border-radius:4px;font-size:15px}
@media (max-width:760px){.w54.kc .hero h1{font-size:12vw}}

/* Knysna Yacht Company logo above the badges (black PNG shown white on the dark hero) */
.w54.kc .kc-logo{display:block;width:auto;height:72px;margin-bottom:26px;filter:brightness(0) invert(1)}
@media (max-width:760px){.w54.kc .kc-logo{height:52px;margin-bottom:20px}}
@media (max-width:760px){.w54.kc .hero .wrap{padding-top:120px}}