/* ================================================================= Dee Digital Solutions — Pricing page sections (pricing-tiers, pricing-list, faq). Uses the theme's existing tokens (--cyan, --stroke, --grey, --dds-radius) so it inherits any Global Styles changes automatically. ================================================================= */ /* ---------------------------------------------------------- TIERS */ .dds-pricing .pricing-grid{ display:grid; gap:24px; } .dds-pricing .pricing-grid.cols-2{grid-template-columns:repeat(2,1fr)} .dds-pricing .pricing-grid.cols-3{grid-template-columns:repeat(3,1fr)} .dds-pricing .pricing-grid.cols-4{grid-template-columns:repeat(4,1fr)} .price-card{ position:relative; display:flex; flex-direction:column; padding:34px 30px 32px; border-radius:var(--dds-radius,22px); background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015)); border:1px solid var(--stroke); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); transition:border-color .35s ease,box-shadow .35s ease,transform .35s ease; } .price-card:hover{ border-color:rgba(0,245,255,.4); box-shadow:0 30px 80px -34px rgba(0,245,255,.45); transform:translateY(-4px); } .price-card.is-featured{ border-color:rgba(0,245,255,.55); background:linear-gradient(180deg,rgba(0,245,255,.09),rgba(155,48,255,.05)); box-shadow:0 0 0 1px rgba(0,245,255,.22),0 40px 90px -40px rgba(0,245,255,.6); } .price-badge{ position:absolute;top:-13px;left:30px; display:inline-flex;align-items:center; padding:6px 14px;border-radius:999px; font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase; color:#001318;background:var(--cyan); box-shadow:0 8px 24px -8px rgba(0,245,255,.8); } .price-name{font-size:22px;font-weight:700;letter-spacing:-0.01em;color:#fff;line-height:1.15} .price-desc{font-size:14px;color:var(--grey);margin-top:10px;line-height:1.55} .price-amount{ display:flex;align-items:baseline;gap:8px;flex-wrap:wrap; margin:24px 0 4px;padding-bottom:24px; border-bottom:1px solid var(--stroke); } .price-value{font-size:clamp(32px,3.4vw,44px);font-weight:900;letter-spacing:-0.03em;color:#fff;line-height:1} .price-note{font-size:13px;font-weight:500;color:var(--grey-2);letter-spacing:.02em} .price-features{list-style:none;margin:24px 0 0;display:flex;flex-direction:column;gap:13px} .price-features li{ position:relative;padding-left:28px; font-size:14px;color:#c9c9d6;line-height:1.5; } .price-features li::before{ content:"";position:absolute;left:4px;top:3px; width:6px;height:11px; border:solid var(--cyan);border-width:0 2px 2px 0; transform:rotate(45deg); filter:drop-shadow(0 0 5px rgba(0,245,255,.7)); } .price-btn{margin-top:28px;align-self:stretch;justify-content:center;text-align:center} /* ---------------------------------------------------- SERVICE LIST */ .dds-pricing-list .plist{ display:flex;flex-direction:column; border-top:1px solid var(--stroke); } .plist-row{ display:flex;align-items:center;justify-content:space-between;gap:32px; padding:26px 4px; border-bottom:1px solid var(--stroke); transition:background .3s ease,padding-left .3s ease; } .plist-row:hover{background:rgba(0,245,255,.03);padding-left:14px} .plist-name{font-size:19px;font-weight:700;letter-spacing:-0.01em;color:#fff;line-height:1.2} .plist-desc{font-size:14px;color:var(--grey);margin-top:6px;line-height:1.55;max-width:640px} .plist-aside{display:flex;align-items:center;gap:24px;flex:none;text-align:right} .plist-price{font-size:20px;font-weight:900;letter-spacing:-0.02em;color:var(--cyan);text-shadow:0 0 18px rgba(0,245,255,.35);white-space:nowrap} .plist-link{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#d6d6e2;white-space:nowrap} .plist-link .arrow-mini{transition:transform .3s ease} .plist-link:hover{color:var(--cyan)} .plist-link:hover .arrow-mini{transform:translateX(4px)} /* ----------------------------------------------------------- FAQ */ .dds-faq .faq-list{display:flex;flex-direction:column;gap:14px;max-width:920px} .faq-item{ border:1px solid var(--stroke); border-radius:16px; background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01)); overflow:hidden; transition:border-color .3s ease; } .faq-item[open]{border-color:rgba(0,245,255,.35)} .faq-item summary{ display:flex;align-items:center;justify-content:space-between;gap:20px; padding:22px 26px;cursor:pointer;list-style:none; font-size:17px;font-weight:600;color:#fff;letter-spacing:-0.01em; } .faq-item summary::-webkit-details-marker{display:none} .faq-item summary:hover{color:var(--cyan)} .faq-ico{position:relative;flex:none;width:18px;height:18px} .faq-ico::before,.faq-ico::after{ content:"";position:absolute;background:var(--cyan);border-radius:2px; box-shadow:0 0 8px rgba(0,245,255,.6);transition:transform .3s ease,opacity .3s ease; } .faq-ico::before{top:8px;left:0;width:18px;height:2px} .faq-ico::after{top:0;left:8px;width:2px;height:18px} .faq-item[open] .faq-ico::after{transform:scaleY(0);opacity:0} .faq-a{padding:0 26px 24px} .faq-a p{font-size:15px;color:#c9c9d6;line-height:1.7;margin:0} .faq-a p + p{margin-top:12px} /* ----------------------------------------------------- RESPONSIVE */ @media (max-width:1024px){ .dds-pricing .pricing-grid.cols-3, .dds-pricing .pricing-grid.cols-4{grid-template-columns:repeat(2,1fr)} } @media (max-width:680px){ .dds-pricing .pricing-grid.cols-2, .dds-pricing .pricing-grid.cols-3, .dds-pricing .pricing-grid.cols-4{grid-template-columns:1fr} .price-card.is-featured{transform:none} .plist-row{flex-direction:column;align-items:flex-start;gap:14px} .plist-row:hover{padding-left:4px} .plist-aside{width:100%;justify-content:space-between;text-align:left} .faq-item summary{font-size:16px;padding:18px 20px} .faq-a{padding:0 20px 20px} } /* ================================================================= Legal pages (Privacy Policy / Terms & Conditions) — long-form richtext. Scoped to .dds-legal-page so no other rich-text block is affected. Gives the numbered

sections and