/* Printprodukte */
.page-hero{ padding:150px 0 40px; }
.pr-hero{ display:grid; gap:40px; align-items:center; }
@media (min-width:960px){ .pr-hero{ grid-template-columns:1.05fr .95fr; gap:64px; } }
.btns{ display:flex; flex-wrap:wrap; gap:12px; }
.pr-hero-art{ position:relative; min-height:360px; display:grid; place-items:center; }

/* Versprechen */
.pr-promise{ display:grid; gap:18px; }
@media (min-width:900px){ .pr-promise{ grid-template-columns:repeat(3,1fr); } }
.pr-promise > div{ background:var(--surface); border-top:3px solid var(--deep); padding:28px 24px; }
.pr-promise svg{ width:30px; height:30px; fill:none; stroke:var(--deep); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; margin-bottom:14px; }
.pr-promise h3{ font-size:22px; margin-bottom:8px; }
.pr-promise p{ color:var(--muted); font-size:16px; margin:0; }

/* Produktkarten */
.pr-grid{ display:grid; gap:18px; }
@media (min-width:760px){ .pr-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1100px){ .pr-grid--3{ grid-template-columns:repeat(3,1fr); } }
.pr-card{ background:var(--surface); border:1px solid var(--line); display:flex; flex-direction:column; }
.pr-art{ position:relative; aspect-ratio:4/3; background:linear-gradient(160deg,#F8F1EE,#ECE5E1); display:grid; place-items:center; overflow:hidden; }
.section--sand .pr-art{ background:linear-gradient(160deg,#FBF8F6,#F3EDEA); }
.pr-art--wall{ background:linear-gradient(180deg,#F4EFEC 0 78%,#E6DDD8 78%); }
.pr-txt{ padding:26px 24px 28px; display:grid; gap:10px; align-content:start; }
.pr-tag{ font-size:11px; letter-spacing:2.5px; text-transform:uppercase; font-weight:600; color:var(--deep); }
.pr-txt h3{ font-size:26px; line-height:1.15; }
.pr-txt p{ color:var(--muted); font-size:16px; margin:0; }
.pr-list{ list-style:none; padding:0; margin:6px 0 0; display:grid; gap:6px; font-size:15px; }
.pr-list li{ position:relative; padding-left:22px; }
.pr-list li::before{ content:""; position:absolute; left:2px; top:.62em; width:10px; height:1.5px; background:var(--deep); }

/* Mockups */
.m-album{ position:relative; width:46%; aspect-ratio:1; transform:rotate(-6deg); box-shadow:18px 22px 34px -14px rgba(46,42,43,.45); }
.m-album .m-cover{ position:absolute; inset:0; background:#E9DFD9; padding:13%; border-radius:2px 6px 6px 2px; }
.m-album .m-cover img{ width:100%; height:100%; object-fit:cover; display:block; }
.m-cover--acryl img{ box-shadow:0 0 0 1px rgba(255,255,255,.5), inset 0 0 0 1px rgba(255,255,255,.4); filter:saturate(1.05) contrast(1.04); }
.m-cover--acryl::after{ content:""; position:absolute; inset:13%; background:linear-gradient(125deg,rgba(255,255,255,.55),rgba(255,255,255,0) 38%); pointer-events:none; }
.m-spine{ position:absolute; left:0; top:0; bottom:0; width:7%; background:linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,0)); }
.m-album--hero{ width:min(320px,62%); position:relative; z-index:2; left:-14%; }
.m-acryl--hero{ position:absolute; right:2%; top:2%; width:min(230px,42%); aspect-ratio:3/4; transform:rotate(4deg); }
.m-album--small{ width:36%; position:absolute; left:16%; bottom:14%; transform:rotate(-8deg); z-index:2; }

.m-box{ position:absolute; right:14%; top:16%; width:44%; aspect-ratio:1; background:#D9CEC7; transform:rotate(5deg); box-shadow:14px 18px 30px -14px rgba(46,42,43,.4); padding:16%; }
.m-box-lid{ width:100%; height:100%; overflow:hidden; box-shadow:inset 0 0 0 4px #D9CEC7; }
.m-box-lid img{ width:100%; height:100%; object-fit:cover; display:block; }

.m-folio{ position:relative; width:52%; aspect-ratio:4/3; background:#2E2A2B; padding:6%; transform:rotate(-3deg); box-shadow:18px 22px 34px -14px rgba(46,42,43,.5); }
.m-folio-print{ position:absolute; inset:8% 30% 8% 8%; background:#FBF8F6; padding:5%; box-shadow:0 6px 14px rgba(0,0,0,.25); }
.m-folio-print--2{ inset:12% 6% 4% 34%; transform:rotate(5deg); }
.m-folio-print img{ width:100%; height:100%; object-fit:cover; display:block; }

.m-mini{ display:flex; gap:0; transform:rotate(-3deg); filter:drop-shadow(12px 16px 16px rgba(46,42,43,.3)); }
.m-mini span{ width:min(100px,22vw); aspect-ratio:1; background:#FBF8F6; padding:8px; display:block; }
.m-mini span:nth-child(1){ transform:perspective(400px) rotateY(18deg); }
.m-mini span:nth-child(2){ transform:perspective(400px) rotateY(-18deg); }
.m-mini span:nth-child(3){ transform:perspective(400px) rotateY(18deg); }
.m-mini img{ width:100%; height:100%; object-fit:cover; display:block; }

.m-acryl{ position:relative; width:52%; aspect-ratio:3/2; box-shadow:10px 16px 26px -10px rgba(46,42,43,.45); margin-bottom:12%; }
.m-acryl img{ width:100%; height:100%; object-fit:cover; display:block; }
.m-acryl::after{ content:""; position:absolute; inset:0; background:linear-gradient(120deg,rgba(255,255,255,.45),rgba(255,255,255,0) 35%); pointer-events:none; }

.m-frame{ width:34%; aspect-ratio:4/5; background:#3A3334; padding:3%; box-shadow:10px 16px 26px -10px rgba(46,42,43,.45); margin-bottom:12%; }
.m-pp{ width:100%; height:100%; background:#FBF8F6; padding:16%; }
.m-pp img{ width:100%; height:100%; object-fit:cover; display:block; }

.m-set{ display:flex; gap:6%; align-items:center; width:80%; justify-content:center; margin-bottom:12%; }
.m-acryl--s{ width:26%; aspect-ratio:1; margin:0; display:block; }
.m-acryl--tall{ width:30%; aspect-ratio:3/4; }

/* Empfehlung je Shooting */
.pr-match{ display:grid; gap:10px; }
@media (min-width:900px){ .pr-match{ grid-template-columns:repeat(2,1fr); gap:14px; } }
.pr-match a{ display:grid; grid-template-columns:1fr auto; gap:6px 16px; padding:24px 24px 24px 28px; background:var(--surface); border:1px solid var(--line); border-left:6px solid var(--c); text-decoration:none; color:var(--ink); transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
.pr-match a:hover{ transform:translateY(-2px); box-shadow:0 14px 30px -18px rgba(46,42,43,.4); color:var(--ink); }
.pr-match b{ font-family:var(--serif); font-weight:400; font-size:24px; }
.pr-match span{ grid-column:1; color:var(--muted); font-size:16px; }
.pr-match i{ grid-column:2; grid-row:1 / span 2; align-self:center; font-style:normal; color:var(--deep); font-size:20px; }

/* Ablauf (wie Gutschein) */
.how{ display:grid; gap:18px; }
@media (min-width:900px){ .how{ grid-template-columns:repeat(3,1fr); } }
.how div{ border-top:3px solid var(--deep); background:var(--surface); padding:26px 24px; }
.how b{ display:block; font-family:var(--serif); font-weight:400; font-size:38px; color:var(--deep); line-height:1; margin-bottom:12px; }
.how h3{ font-size:22px; margin-bottom:6px; }
.how p{ color:var(--muted); font-size:16px; }

/* Hinweis auf Shooting-Seiten */
.print-hint{ margin-top:18px; display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:16px; color:var(--muted); }
.print-hint a{ font-weight:600; }

@media (prefers-reduced-motion:reduce){ .pr-match a{ transition:none; } }
