/* Digital Product Passport landing page — scoped enhancements on top of site.css.
   Retains DesignBub's dark / warm yellow palette, grid, type, nav, cards and CTA.
   Standalone page-specific file; no site-wide component overrides. */
.dpp-page{--dpp-yellow:#f5e50a;--dpp-black:#0d0d0d}
.dpp-page main{overflow:hidden}
.dpp-page section[id]{scroll-margin-top:96px}
.dpp-page .hero{min-height:780px;padding-top:160px;padding-bottom:110px}
.dpp-page .hero-inner{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:48px}
.dpp-page .hero h1{font-size:clamp(42px,4.9vw,78px);max-width:800px;letter-spacing:-.055em}
.dpp-page .dpp-hero-kicker{margin-top:23px;font-family:var(--syne);font-size:clamp(16px,1.65vw,24px);font-weight:700;color:var(--dpp-yellow);line-height:1.38;max-width:660px}
.dpp-page .hero-text{font-size:16px;line-height:1.8;margin-top:18px;max-width:665px}
.dpp-page .hero-stats{margin-top:35px}
.dpp-page .hero-stats .stat{padding:17px 16px;border-radius:18px}
.dpp-page .hero-stats .stat strong{font-size:25px;letter-spacing:-.03em}
.dpp-page .hero-stats .stat span{line-height:1.4}
.dpp-page .dpp-hero-art{position:relative;padding:34px 12px 22px 0;min-width:0}
.dpp-page .dpp-visual-card{padding:29px;background:#f9f9f2;color:#101010;box-shadow:0 36px 100px rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.18);border-radius:28px;transform:rotate(2deg);transition:transform .3s ease;position:relative}
.dpp-page .dpp-visual-card:hover{transform:rotate(0deg)}
.dpp-page .dpp-visual-top,.dpp-page .dpp-visual-product,.dpp-page .dpp-visual-row{display:flex;align-items:center;justify-content:space-between;gap:15px}
.dpp-page .dpp-visual-top{padding-bottom:23px;border-bottom:1px solid #deded8}
.dpp-page .dpp-visual-mark{font-family:var(--syne);font-weight:800;font-size:27px;letter-spacing:-.07em}
.dpp-page .dpp-visual-pill{font-size:10px;border:1px solid #d8d7ce;padding:8px 11px;border-radius:100px;color:#666;letter-spacing:.015em}
.dpp-page .dpp-visual-product{justify-content:flex-start;gap:18px;padding:31px 0 28px}
.dpp-page .dpp-cube{height:85px;width:85px;flex:none;border-radius:20px;background:linear-gradient(140deg,#f5e50a,#ddc600);display:grid;place-items:center;box-shadow:inset -13px -8px 0 rgba(0,0,0,.09)}
.dpp-page .dpp-cube span{color:#0d0d0d;font-size:31px;font-family:var(--syne);font-weight:800;letter-spacing:-.08em}
.dpp-page .dpp-visual-overline{color:#777;font-size:9px;letter-spacing:.12em;font-weight:900}
.dpp-page .dpp-visual-product h2{font-family:var(--syne);font-size:27px;letter-spacing:-.04em;margin:6px 0}
.dpp-page .dpp-visual-product p{font-size:11px;color:#666;line-height:1.5}
.dpp-page .dpp-visual-row{min-height:51px;padding:13px 0;border-top:1px solid #e3e3dc;font-size:12px}
.dpp-page .dpp-visual-row span{color:#63635e}
.dpp-page .dpp-visual-row b{font-weight:700;text-align:right}
.dpp-page .dpp-visual-bottom{border-radius:13px;background:#e8e9dc;color:#4a4b3e;font-size:10px;font-weight:600;line-height:1.5;margin-top:24px;padding:14px;display:flex;gap:9px;align-items:center}
.dpp-page .dpp-live-dot{display:block;flex-shrink:0;width:9px;height:9px;border-radius:100px;background:#b4b61f;box-shadow:0 0 0 4px rgba(180,182,31,.13)}
.dpp-page .dpp-visual-float{position:absolute;right:-12px;bottom:-16px;padding:16px 20px;border-radius:17px;background:var(--dpp-yellow);color:var(--dpp-black);font-size:12px;line-height:1.5;box-shadow:0 15px 40px rgba(0,0,0,.2)}
.dpp-page .dpp-visual-float strong{font-family:var(--syne);font-size:13px}
/* Readable long-form copy with the same editorial heading style as the template */
.dpp-page .dpp-white{background:#fff}
.dpp-page .dpp-alt{background:#f6f5f0}
.dpp-page .dpp-content-wrap{max-width:920px;margin:0 auto}
.dpp-page .dpp-content-wrap>h2,.dpp-page .dpp-rich>h2,.dpp-page .dpp-dark h2{font-family:var(--syne);font-size:clamp(31px,4.1vw,55px);font-weight:800;letter-spacing:-.04em;line-height:1.11;margin-bottom:26px}
.dpp-page .dpp-content-wrap>p,.dpp-page .dpp-rich>p{font-family:var(--dm);color:#626262;font-size:16px;line-height:1.91;margin-top:17px}
.dpp-page .dpp-content-wrap>p:first-of-type,.dpp-page .dpp-rich>p:first-of-type{margin-top:0}
.dpp-page .dpp-intro{background:#fff}
.dpp-page .dpp-intro-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(270px,.8fr);gap:70px;align-items:start}
.dpp-page .dpp-intro-aside{position:sticky;top:100px;border-radius:27px;background:#0d0d0d;color:#fff;padding:31px;box-shadow:0 26px 62px rgba(0,0,0,.08)}
.dpp-page .dpp-intro-aside .dpp-mini-label{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--dpp-yellow);font-weight:900}
.dpp-page .dpp-intro-aside h3{margin-top:16px;font-family:var(--syne);font-size:27px;letter-spacing:-.025em;line-height:1.24}
.dpp-page .dpp-intro-aside p{margin-top:17px;font-size:14px;line-height:1.78;color:rgba(255,255,255,.7)}
.dpp-page .dpp-intro-aside a{margin-top:27px;font-size:13px;padding:13px 19px}
/* Six service cards, preserving the site detail-card hover treatment */
.dpp-page .dpp-services .section-head{max-width:820px}
.dpp-page .dpp-services .detail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.dpp-page .dpp-services .detail-card{min-height:0;cursor:default}
.dpp-page .dpp-services .detail-card .icon{font-family:var(--syne);font-size:16px;font-weight:800;background:#fff8b8;color:#333}
.dpp-page .dpp-services .detail-card h3{font-size:20px;line-height:1.25}
.dpp-page .dpp-services .detail-card p{font-size:14px;line-height:1.78}
.dpp-page .dpp-services .detail-card small{font-size:10px;font-weight:700}
/* Industries */
.dpp-page .dpp-industry-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.dpp-page .dpp-industry-grid .keyword-card{padding:27px;border-radius:23px}
.dpp-page .dpp-industry-grid .keyword-card h3{font-family:var(--syne);font-size:20px;font-weight:800;line-height:1.35}
.dpp-page .dpp-industry-grid .keyword-card p{font-size:14px;line-height:1.85}
.dpp-page .dpp-sector-num{display:inline-flex;font-family:var(--syne);font-size:12px;font-weight:800;background:#f5e50a;color:#0d0d0d;border-radius:9px;padding:8px 10px;margin-bottom:20px}
/* Six implementation steps */
.dpp-page .dpp-process .process-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.dpp-page .dpp-process .process-step{border-right:1px solid var(--border);border-bottom:1px solid var(--border);min-height:0;padding:29px 28px}
.dpp-page .dpp-process .process-step:nth-child(3n){border-right:0}
.dpp-page .dpp-process .process-step:nth-last-child(-n+3){border-bottom:0}
.dpp-page .dpp-process .process-step h3{margin:21px 0 10px;font-size:18px}
.dpp-page .dpp-process .process-step p{font-size:13px;line-height:1.85}
/* Pricing */
.dpp-page .dpp-pricing .section-head h2{color:#fff}
.dpp-page .dpp-pricing .section-head p{color:rgba(255,255,255,.62)}
.dpp-page .dpp-pricing-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px;align-items:stretch}
.dpp-page .dpp-pricing-grid .plan{position:relative;padding:25px 23px 26px;min-width:0;display:flex;flex-direction:column;border-radius:24px}
.dpp-page .dpp-pricing-grid .plan h3{font-size:21px;line-height:1.3;min-height:55px;letter-spacing:-.025em}
.dpp-page .dpp-pricing-grid .plan span.dpp-price-label{font-size:10px;color:#f5e50a;letter-spacing:.09em}
.dpp-page .dpp-pricing-grid .plan.featured span.dpp-price-label{color:#222}
.dpp-page .dpp-price-amount{margin-top:11px;margin-bottom:6px}
.dpp-page .dpp-price-amount strong{display:block;font-size:clamp(30px,2.6vw,39px);line-height:1.2;letter-spacing:-.045em}
.dpp-page .dpp-price-amount small{color:rgba(255,255,255,.57);font-size:11px;line-height:1.4}
.dpp-page .dpp-pricing-grid .plan.featured .dpp-price-amount small{color:rgba(13,13,13,.6)}
.dpp-page .dpp-pricing-grid .plan p{font-size:13px;line-height:1.77;margin-top:15px;overflow-wrap:anywhere}
.dpp-page .dpp-plan-cta{margin-top:auto;padding:15px 16px;border:1px solid rgba(255,255,255,.22);border-radius:40px;color:#fff;text-align:center;font-size:13px;font-weight:800;display:block;transition:.2s}
.dpp-page .dpp-plan-cta:hover{background:#f5e50a;border-color:#f5e50a;color:#0d0d0d}
.dpp-page .plan.featured .dpp-plan-cta{background:#0d0d0d;border-color:#0d0d0d;color:#fff}
.dpp-page .plan.featured .dpp-plan-cta:hover{background:#fff;color:#0d0d0d;border-color:#fff}
.dpp-page .dpp-cost-note{margin-top:25px;border-radius:19px;background:#1a1a1a;border:1px solid rgba(255,255,255,.1);padding:28px 32px}
.dpp-page .dpp-cost-note h3{font-family:var(--syne);font-size:22px}
.dpp-page .dpp-cost-note p{color:rgba(255,255,255,.65);font-size:14px;line-height:1.78;margin-top:9px}
/* Dark security segment */
.dpp-page .dpp-dark .dpp-content-wrap>h2{color:#fff}
.dpp-page .dpp-dark .dpp-content-wrap>p{color:rgba(255,255,255,.65)}
.dpp-page .dpp-inline-cta{margin-top:28px}
/* FAQ accordion adheres to site's FAQ button format and site.js behaviour */
.dpp-page .dpp-faq .faq-layout{grid-template-columns:minmax(250px,390px) minmax(0,1fr);gap:65px;align-items:start}
.dpp-page .dpp-faq .faq-left{position:sticky;top:104px}
.dpp-page .dpp-faq .faq-item button{line-height:1.45}
.dpp-page .dpp-faq .faq-answer p{font-size:14px;line-height:1.8}
/* CTA: keep brand yellow, but prevent dense long-form CTA from stretching */
.dpp-page .cta .container{max-width:850px}
.dpp-page .cta p{max-width:790px}
.dpp-page .cta p+p{margin-top:16px}
/* References */
.dpp-page .dpp-resources{padding-top:78px;padding-bottom:100px}
.dpp-page .dpp-resource-list{padding:0;list-style:none;display:grid;gap:12px;margin:25px 0 28px}
.dpp-page .dpp-resource-list li a{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:17px 21px;border:1px solid #e4e4df;border-radius:15px;background:#f9f9f5;font-size:14px;line-height:1.5;font-weight:700;color:#2b2b2b;transition:.18s}
.dpp-page .dpp-resource-list li a:hover{background:#f5e50a;border-color:#f5e50a}
.dpp-page .dpp-resource-list li a span{flex-shrink:0}
.dpp-page .dpp-resources .dpp-content-wrap>p:last-child{font-size:13px;color:#777;border-top:1px solid #deded8;padding-top:20px;margin-top:30px}
/* Responsive */
@media(max-width:1180px){
 .dpp-page .hero-inner{grid-template-columns:1fr .95fr;gap:30px}
 .dpp-page .dpp-pricing-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .dpp-page .dpp-services .detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .dpp-page .dpp-industry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
 .dpp-page .hero-inner{grid-template-columns:1fr;gap:30px}
 .dpp-page .hero{min-height:0;padding-top:120px;padding-bottom:80px}
 .dpp-page .hero h1{max-width:900px}
 .dpp-page .dpp-hero-art{max-width:560px;width:100%;margin:0 auto}
 .dpp-page .dpp-intro-layout{grid-template-columns:1fr;gap:30px}
 .dpp-page .dpp-intro-aside{position:static}
 .dpp-page .dpp-faq .faq-layout{grid-template-columns:1fr;gap:30px}
 .dpp-page .dpp-faq .faq-left{position:static}
}
@media(max-width:768px){
 .dpp-page .hero{padding:115px 20px 75px}
 .dpp-page .dpp-hero-kicker{font-size:17px}
 .dpp-page .hero h1{font-size:clamp(37px,9vw,56px)}
 .dpp-page .dpp-visual-card{transform:none;padding:19px}
 .dpp-page .dpp-visual-float{right:0;bottom:-18px}
 .dpp-page .dpp-content-wrap>h2,.dpp-page .dpp-rich>h2,.dpp-page .dpp-dark h2{font-size:clamp(29px,7.8vw,43px)}
 .dpp-page .dpp-content-wrap>p,.dpp-page .dpp-rich>p{font-size:15px;line-height:1.83}
 .dpp-page .dpp-process .process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .dpp-page .dpp-process .process-step:nth-child(3n){border-right:1px solid var(--border)}
 .dpp-page .dpp-process .process-step:nth-child(2n){border-right:0}
 .dpp-page .dpp-process .process-step:nth-last-child(-n+3){border-bottom:1px solid var(--border)}
 .dpp-page .dpp-process .process-step:nth-last-child(-n+2){border-bottom:0}
 .dpp-page .dpp-pricing-grid{grid-template-columns:1fr}
 .dpp-page .dpp-pricing-grid .plan h3{min-height:0}
 .dpp-page .dpp-industry-grid{grid-template-columns:1fr}
 .dpp-page .dpp-services .detail-grid{grid-template-columns:1fr}
 .dpp-page .dpp-resources{padding-top:60px;padding-bottom:75px}
}
@media(max-width:520px){
 .dpp-page .hero-stats{grid-template-columns:1fr 1fr 1fr;gap:8px}
 .dpp-page .hero-stats .stat{padding:12px 9px;border-radius:13px}
 .dpp-page .hero-stats .stat strong{font-size:20px}
 .dpp-page .hero-stats .stat span{font-size:10px}
 .dpp-page .dpp-visual-product h2{font-size:23px}
 .dpp-page .dpp-cube{width:66px;height:66px}
 .dpp-page .dpp-process .process-grid{grid-template-columns:1fr}
 .dpp-page .dpp-process .process-step,.dpp-page .dpp-process .process-step:nth-child(3n){border-right:0}
 .dpp-page .dpp-process .process-step:nth-last-child(2){border-bottom:1px solid var(--border)}
 .dpp-page .dpp-process .process-step:last-child{border-bottom:0}
 .dpp-page .dpp-cost-note{padding:22px}
 .dpp-page .dpp-faq .faq-item button{font-size:15px}
 .dpp-page .dpp-resource-list li a{font-size:12.5px}
}
@media(prefers-reduced-motion:reduce){.dpp-page .dpp-visual-card,.dpp-page .dpp-resource-list li a{transition:none}}