/* Service Detail Layout */ .service-detail { padding: var(--spacing-sm) 0; /* PAKEITIMAS: Padidiname plotį, kad tilptų 3 kortelės */ max-width: 1200px; margin: 0 auto; } .service-header-block { /*margin-bottom: var(--spacing-md);*/ /*padding-bottom: var(--spacing-md);*/ /*border-bottom: 1px solid var(--color-border);*/ /* Antraštę paliekame siauresnę dėl estetikos */ max-width: 900px; } .service-meta { display: block; margin-top: var(--spacing-sm); color: #666; font-size: 1.1rem; } .service-content { font-size: 1.15rem; line-height: 1.8; color: #333; } /* Svarbu: Apribojame teksto plotį, kad būtų patogu skaityti, nors pats puslapis yra platus dėl kainų lentelių */ .service-content > p, .service-content > ul, .service-content > h2, .service-content > h3:not(.pricing-card h3) { max-width: 800px; } .service-content h2 { margin-top: var(--spacing-lg); font-size: 1.8rem; } .service-content ul { margin: 0 0; list-style: none; } /* Išimtis kainų kortelėms, kad jų sąrašai nebūtų paveikti */ .service-content ul:not(.features-list) li { margin-bottom: 0.75rem; padding-left: 1.5rem; position: relative; } .service-content ul:not(.features-list) li::before { content: "•"; position: absolute; left: 0; color: var(--color-text); font-weight: bold; } /* --- KAINŲ LENTELIŲ STILIUS (PRICING GRID) --- */ .pricing-section { width: 100%; /* Užima visus 1200px */ margin-top: 60px; margin-bottom: 60px; } .pricing-grid { display: grid; /* Kortelės bus min 300px, bet išsiplės kiek telpa */ grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 2rem; margin-top: 30px; } .pricing-card { background: #fff; border: 1px solid #e0e0e0; border-radius: 8px; padding: 30px; transition: transform 0.3s ease, box-shadow 0.3s ease; position: relative; display: flex; flex-direction: column; } .pricing-card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1); border-color: #0056b3; } .pricing-card.featured { border: 2px solid #0056b3; background-color: #f9fbfd; } .pricing-card h3 { margin-top: 0; color: #333; font-size: 1.5rem; } .price-tag { font-size: 2rem; font-weight: bold; color: #0056b3; margin: 15px 0; } .price-sub { font-size: 0.9rem; color: #666; font-weight: normal; } .duration { font-style: italic; color: #555; margin-bottom: 20px; display: block; } .features-list { list-style: none; padding: 0; margin: 0 0 20px 0; flex-grow: 1; } .features-list li { padding: 8px 0; border-bottom: 1px solid #eee; position: relative; padding-left: 25px; font-size: 0.95rem; /* Šiek tiek mažesnis šriftas kortelėse */ } .features-list li::before { content: "✓"; color: #28a745; position: absolute; left: 0; font-weight: bold; } .badge { position: absolute; top: -12px; right: 20px; background: #0056b3; color: white; padding: 5px 10px; border-radius: 4px; font-size: 0.8rem; font-weight: bold; text-transform: uppercase; } /* --- CTA SECTION --- */ .cta-section { margin-top: var(--spacing-sm); padding: var(--spacing-lg); background-color: var(--color-light-gray); border: 1px solid var(--color-border); text-align: center; border-radius: 4px; max-width: 900px; /* CTA paliekame siauresnį, kad atrodytų tvarkingai */ margin-left: auto; margin-right: auto; } .cta-section h3 { margin-bottom: var(--spacing-sm); } .cta-section p { margin-bottom: var(--spacing-md); margin-left: auto; margin-right: auto; }