/*
Theme Name: ColorShine KISS
Author: IN4MEDIA
Description: Persönliches, farbenfrohes Theme für ColorShine. Texte und Kontakt im Customizer bearbeiten.
Version: 1.0.2
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: colorshine-kiss
*/
:root{--ink:#231f20;--purple:#76308a;--pink:#c12c8b;--blue:#23b6df;--paper:#faf9f6;--line:#dedbd7}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.6}a{color:inherit}img{max-width:100%;height:auto;display:block}button{font:inherit}.wrap{width:min(1180px,calc(100% - 64px));margin:auto}.header{background:var(--paper);border-bottom:1px solid var(--line)}.nav{height:108px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand img{width:150px}.links{display:flex;align-items:center;gap:30px;font-size:14px;font-weight:700}.links a{text-decoration:none}.links a:hover{color:var(--purple)}.links .nav-contact{background:var(--ink);color:white;padding:11px 21px;border-radius:30px}.menu-toggle{display:none}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:65px;align-items:center;padding-top:62px;padding-bottom:70px}.eyebrow{text-transform:uppercase;letter-spacing:2.3px;font-size:11px;font-weight:800;display:flex;align-items:center;gap:12px}.eyebrow:before{content:'';width:25px;height:3px;background:var(--pink)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(56px,6.2vw,88px);line-height:1.02;letter-spacing:-5px;margin:25px 0 26px;font-weight:900}h1 span{display:block;color:var(--purple);position:relative}h1 span:after{content:'';display:block;width:82%;height:9px;background:var(--blue);border-radius:60% 30% 50% 20%;transform:rotate(-2deg);margin:12px 0 0}p{font-size:17px}.intro{max-width:420px;color:#615b60}.buttons{display:flex;gap:13px;flex-wrap:wrap;margin-top:30px}.button{display:inline-flex;align-items:center;gap:22px;padding:14px 22px;border-radius:32px;background:var(--purple);color:white;font-size:14px;font-weight:700;text-decoration:none;transition:transform .2s,background .2s}.button:hover{transform:translateY(-3px);background:#592069}.button.secondary{background:transparent;color:var(--ink);border:1px solid #c9c3c8}.micro{font-size:12px;margin:27px 0 0;color:#686069}.hero-art{position:relative;padding:10px 20px 16px 0}.hero-art:before{content:'';position:absolute;inset:33px 0 0 29px;background:var(--purple);border-radius:140px 18px 90px 18px;transform:rotate(3deg)}.portrait{position:relative;width:100%;height:550px;object-fit:cover;object-position:50% 44%;border-radius:140px 18px 90px 18px}.badge{position:absolute;bottom:24px;left:-38px;background:#bdeef6;padding:17px 26px;transform:rotate(-5deg);box-shadow:4px 5px 0 var(--ink);font-weight:800;font-size:17px;line-height:1.3}.badge small{display:block;font-size:11px;letter-spacing:1px;margin-top:6px;font-weight:500}.star{position:absolute;right:-10px;top:-13px;color:var(--pink);font-size:95px;line-height:1;transform:rotate(15deg);text-shadow:2px 2px var(--paper)}.ribbon{background:var(--ink);color:white;padding:19px 0}.ribbon .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:13px;letter-spacing:1.5px}.ribbon b{color:#64d6f2;font-size:22px}.section{padding-top:92px;padding-bottom:92px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:36px}h2{font-size:clamp(33px,4vw,50px);line-height:1.12;letter-spacing:-2px;margin:14px 0 0}.aside-copy{max-width:320px;font-size:15px;color:#696168;margin:0}.services{display:grid;grid-template-columns:1fr 1fr;gap:25px}.service{position:relative;background:#e8f5f8;padding:38px;border-radius:8px 55px 8px 8px;min-height:295px}.service:nth-child(2){background:#f2e6f2}.number{font-size:12px;font-weight:700;letter-spacing:2px}.service-symbol{position:absolute;right:33px;top:20px;font-size:49px;font-weight:400;color:#1084a3}.service:nth-child(2) .service-symbol{color:var(--purple)}h3{font-size:30px;letter-spacing:-1px;line-height:1.2;margin:36px 0 15px}.service p{font-size:16px;max-width:380px;color:#58545b}.text-link{font-size:13px;text-decoration:none;font-weight:700;border-bottom:2px solid var(--pink);padding-bottom:5px}.about{background:white;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.about-logo{padding:20px;transform:rotate(-5deg)}.about p{margin:24px 0;color:#605861}.signature{font-size:18px;font-weight:700;color:var(--purple)}.contact{background:var(--purple);color:white;border-radius:14px 80px 14px 14px;padding:48px 52px;display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center}.contact h2{font-size:47px;margin:0 0 20px}.contact p{font-size:15px;color:#eddaee;margin:0}.contact-details{display:flex;flex-direction:column;gap:12px;align-items:flex-start}.contact-details a{font-size:23px;text-decoration:none;font-weight:700;overflow-wrap:anywhere}.contact-details address{font-size:14px;font-style:normal;color:#eddaee;margin-top:6px}.footer{padding:0 0 30px;font-size:12px}.footer .wrap{display:flex;justify-content:space-between;gap:24px}.legal-links{display:flex;gap:20px}.content-page{min-height:60vh;padding:60px 0}.content-page h1{font-size:50px;letter-spacing:-2px}.content-page .wp-block-image img{height:auto}.skip-link{position:absolute;top:-100px}.skip-link:focus{top:10px;left:10px;background:white;padding:15px;z-index:30}:focus-visible{outline:3px solid var(--pink);outline-offset:5px}.extra-content{margin-top:60px}.admin-bar .header{top:32px}
@media(max-width:800px){.wrap{width:calc(100% - 40px)}.nav{height:88px}.brand img{width:117px}.menu-toggle{display:block;background:transparent;border:1px solid var(--line);border-radius:20px;padding:8px 17px}.links{display:none;position:absolute;top:88px;left:0;right:0;padding:24px;background:var(--paper);z-index:20;box-shadow:0 12px 15px #0001}.links.open{display:flex;flex-direction:column;align-items:stretch}.hero{grid-template-columns:1fr;gap:35px;padding-top:38px;padding-bottom:45px}h1{font-size:clamp(40px,11.8vw,65px);letter-spacing:-2.5px}.intro{max-width:none}.hero-art{margin:0 5px 0 20px}.portrait{height:470px;object-position:50% 40%}.badge{left:-25px}.ribbon .wrap{flex-wrap:wrap;justify-content:center;font-size:10px;gap:10px 18px}.ribbon b{font-size:16px}.section{padding-top:55px;padding-bottom:55px}.section-heading{display:block}.aside-copy{margin-top:20px;max-width:none}.services,.about-grid,.contact{grid-template-columns:1fr}.service{padding:28px;min-height:280px}.about-grid{gap:18px}.about-logo{max-width:400px;margin:auto}.contact{padding:32px 25px;gap:25px;border-radius:10px 50px 10px 10px}.contact h2{font-size:36px}.contact-details a{font-size:21px}.footer .wrap{flex-direction:column;gap:12px}.admin-bar .links{top:134px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* ColorShine 0.1.2 */
:root{--pink:#cd177e}.hero h1 span{color:var(--pink)}.services{grid-template-columns:repeat(3,minmax(0,1fr))}.service{padding:30px}.service h3{font-size:27px}.service:nth-child(2){background:#fce5f0}.service:nth-child(3){background:#f0e6f5}.about-photo img{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:50% 26%;border-radius:75px 12px 75px 12px}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.project-card{background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden;min-width:0}.card-image img,.card-placeholder{width:100%;aspect-ratio:4/3;object-fit:cover}.card-placeholder{display:grid;place-items:center;background:#fce5f0;color:var(--purple);font-weight:bold}.card-copy{padding:24px}.card-copy h3{font-size:25px;margin:8px 0 16px;overflow-wrap:anywhere}.card-copy h3 a{text-decoration:none}.card-copy h3 a:hover{color:var(--pink)}.card-copy p{font-size:15px}.card-category{color:var(--purple);font-size:12px!important}.post-page{max-width:900px}.post-cover img{max-height:620px;width:100%;object-fit:contain;margin:30px auto}.entry-content{margin-top:35px}.entry-content h2{margin-bottom:24px}.entry-content img{max-width:100%;height:auto}.pagination{margin-top:35px}.page-numbers{padding:8px}.content-page h1{overflow-wrap:anywhere}
@media(max-width:1000px){.services{grid-template-columns:1fr}.links{gap:18px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.project-grid{grid-template-columns:1fr}.about-photo{max-width:420px}.ribbon .wrap>span:last-child{display:none}}

/* Navigation and call hours, 0.1.4 */
.archive-back{margin:0 0 28px}.archive-back:last-child{margin:32px 0 0}.contact-details .call-hours{font-size:14px;line-height:1.5;color:#fff;margin:-5px 0 8px;max-width:100%}

/* ColorShine paint accents: decorative only, original artwork via CSS sprite. */
.paint-splat,.paint-button::after,.post-page>article::before,.category .content-page::before,.about::after{background-image:url('assets/paint-splashes.png');background-repeat:no-repeat;background-size:300% 200%;mix-blend-mode:multiply;pointer-events:none;}
.paint-cyan{background-position:0 0}.paint-pink{background-position:50% 0}.paint-violet{background-position:100% 0}
.service .service-symbol.paint-splat{width:65px;height:65px;top:16px;right:20px;transform:rotate(12deg)}
.service .number{display:block;padding-right:64px;min-height:25px}.service h3{margin-top:31px}
.hero-art .star.paint-splat{width:92px;height:92px;right:-6px;top:-17px;transform:rotate(15deg);text-shadow:none}
.paint-button{position:relative;isolation:isolate;margin:8px 20px 8px 0}
.paint-button::after{content:'';position:absolute;width:42px;height:42px;right:-24px;top:-17px;background-position:50% 100%;transform:rotate(12deg);z-index:-1}
.paint-button-violet::after{background-position:100% 0;transform:rotate(-14deg)}
.about{position:relative;isolation:isolate;overflow:hidden}.about::after{content:'';position:absolute;right:-55px;bottom:-60px;width:240px;height:240px;background-position:0 0;opacity:.09;z-index:-1;transform:rotate(-20deg)}
.post-page>article,.category .content-page{position:relative;isolation:isolate}
.post-page>article::before,.category .content-page::before{content:'';position:absolute;right:0;top:0;width:145px;height:145px;background-position:100% 0;opacity:.08;z-index:-1;transform:rotate(17deg)}
.post-page>article.category-baustellenmomente::before{background-position:50% 0}
.post-page h1::after{content:'';display:block;width:72px;height:5px;background:var(--pink);border-radius:70% 30% 60% 40%;margin-top:24px;transform:rotate(-2deg)}
@media(max-width:600px){.service .service-symbol.paint-splat{width:55px;height:55px}.hero-art .star.paint-splat{width:72px;height:72px;right:0}.about::after{width:160px;height:160px;right:-50px;bottom:-40px}.post-page>article::before,.category .content-page::before{width:100px;height:100px}.paint-button{max-width:calc(100% - 24px)}}
@media(forced-colors:active){.paint-splat,.paint-button::after,.post-page>article::before,.category .content-page::before,.about::after{display:none}}
@media print{.paint-splat,.paint-button::after,.post-page>article::before,.category .content-page::before,.about::after{display:none}}

/* 0.1.5: tighter transition and a cohesive telephone group. */
#projekte.section{padding-bottom:28px}
#kontakt.section{padding-top:28px}
.contact-details{gap:22px}
.contact-phone{display:flex;flex-direction:column;align-items:flex-start;gap:3px;border-left:3px solid #64d6f2;padding-left:15px}
.contact-phone>a{line-height:1.25}
.contact-details .contact-phone .call-hours{margin:0;font-size:14px;line-height:1.4;color:#fff}
.contact-details address{margin-top:0}
@media(max-width:800px){#projekte.section{padding-bottom:20px}#kontakt.section{padding-top:20px}.contact-details{gap:20px}.contact-phone{padding-left:12px}}

/* 0.1.6: prominent brand, extending below the header divider. */
.header{position:relative;z-index:5;overflow:visible}
.nav{position:relative;align-items:center}
.brand{display:block;flex:0 0 300px;align-self:flex-start;margin-top:12px;position:relative;z-index:1}
.brand img{width:300px;max-width:100%;height:auto}
.hero{padding-top:128px}
.content-page{padding-top:126px}
@media(min-width:801px) and (max-width:1100px){.brand{flex-basis:240px}.brand img{width:240px}.nav{gap:16px}.links{gap:16px;font-size:13px}.links .nav-contact{padding:11px 16px}.hero{padding-top:94px}.content-page{padding-top:96px}}
@media(max-width:800px){.brand{flex-basis:210px;margin-top:8px}.brand img{width:210px}.menu-toggle{flex-shrink:0;position:relative;z-index:2}.nav{gap:12px}.hero{padding-top:90px}.content-page{padding-top:90px}}
@media(max-width:360px){.brand{flex-basis:185px}.brand img{width:185px}.hero{padding-top:76px}.content-page{padding-top:76px}}

/* 1.0.0: invitation for genuine customer feedback. */
.feedback-section{padding-top:18px;padding-bottom:24px;scroll-margin-top:30px}
.feedback-box{position:relative;isolation:isolate;overflow:hidden;padding:38px 44px;border:1px solid #e6cfe0;border-radius:14px 58px 14px 14px;background:#fff}
.feedback-copy{position:relative;max-width:790px;z-index:1}
.feedback-box h2{font-size:clamp(27px,3vw,38px);letter-spacing:-1px;margin:12px 0 20px}
.feedback-box p{font-size:16px;margin:0 0 16px}
.feedback-box .feedback-note{font-size:14px;color:#655760}
.feedback-box .feedback-mail-help{font-size:12px;color:#655760;margin:15px 0 0;overflow-wrap:anywhere}
.feedback-splash{position:absolute;width:190px;height:190px;right:-55px;bottom:-60px;opacity:.09;transform:rotate(-15deg);z-index:0}
@media(max-width:800px){.feedback-section{padding-top:10px;padding-bottom:16px}.feedback-box{padding:28px 24px}.feedback-box .button{max-width:100%}.hero .eyebrow{letter-spacing:1.4px}}

/* IN4MEDIA footer credit */
.footer .wrap{flex-wrap:wrap;align-items:baseline}.site-credit{color:#686069}.site-credit a{color:var(--ink);font-weight:700;text-underline-offset:3px}.site-credit a:hover{color:var(--purple)}.legal-links:empty{display:none}