{"id":40,"date":"2026-01-18T08:46:23","date_gmt":"2026-01-18T08:46:23","guid":{"rendered":"https:\/\/divabeautycollege.com\/?page_id=40"},"modified":"2026-03-14T09:02:29","modified_gmt":"2026-03-14T09:02:29","slug":"home-new","status":"publish","type":"page","link":"https:\/\/divabeautycollege.com\/vi\/","title":{"rendered":"Home New"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"40\" class=\"elementor elementor-40\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a123e86 e-flex e-con-boxed e-con e-parent\" data-id=\"a123e86\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-57672f8 elementor-widget elementor-widget-html\" data-id=\"57672f8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n    \/* ======================================================\r\n       PH\u1ea6N 1: HERO SECTION (BANNER CH\u00cdNH)\r\n       ====================================================== *\/\r\n    .hero-section {\r\n        position: relative;\r\n        background-image: url('https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/481059909_654117880299934_1377708193439832250_n.jpg'); \r\n        background-size: cover; \r\n        background-position: center top; \r\n        background-repeat: no-repeat;\r\n        height: 600px; \r\n        display: flex;\r\n        align-items: flex-start;\r\n        justify-content: center; \r\n        padding-top: 15px;\r\n        font-family: 'Segoe UI', sans-serif;\r\n    }\r\n\r\n    .hero-glass-box {\r\n        background: rgba(255, 255, 255, 0.4); \r\n        backdrop-filter: blur(10px); \r\n        -webkit-backdrop-filter: blur(10px);\r\n        padding: 30px 40px;\r\n        max-width: 1000px; width: 96%;\r\n        text-align: center;\r\n        border-radius: 15px;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.1); \r\n        border: 1px solid rgba(255,255,255,0.4);\r\n    }\r\n\r\n    .hero-title {\r\n        color: #C41E3A; \r\n        font-size: 36px; font-weight: 900;\r\n        text-transform: uppercase; margin: 0 0 10px 0; line-height: 1.2;\r\n        text-shadow: 2px 2px 0px rgba(255,255,255,0.8);\r\n    }\r\n\r\n    .hero-desc {\r\n        color: #000; \r\n        font-size: 17px; line-height: 1.5; margin-bottom: 25px;\r\n        font-weight: 700;\r\n        max-width: 900px; margin-left: auto; margin-right: auto;\r\n        text-shadow: 0 0 10px rgba(255,255,255,0.5);\r\n    }\r\n\r\n    .hero-btn {\r\n        display: inline-block;\r\n        background-color: #C41E3A; color: #fff;\r\n        padding: 12px 45px; font-size: 16px; font-weight: 700;\r\n        text-decoration: none; border-radius: 50px;\r\n        transition: 0.3s; box-shadow: 0 5px 15px rgba(196, 30, 58, 0.3);\r\n        cursor: pointer; border: none;\r\n    }\r\n    .hero-btn:hover { background-color: #a01830; transform: translateY(-2px); }\r\n\r\n    @media (max-width: 600px) {\r\n        .hero-section { height: 450px; padding-top: 10px; background-position: center center; }\r\n        .hero-glass-box { width: 95%; padding: 20px 10px; background: rgba(255, 255, 255, 0.55); } \r\n        .hero-title { font-size: 24px; }\r\n        .hero-desc { font-size: 14px; font-weight: 600; margin-bottom: 15px;}\r\n        .hero-btn { padding: 10px 30px; font-size: 14px; }\r\n    }\r\n\r\n    \/* ======================================================\r\n       PH\u1ea6N 2: MODAL FORM \u0110\u0102NG K\u00dd (SI\u00caU TRONG SU\u1ed0T - X2 TRANSPARENCY)\r\n       ====================================================== *\/\r\n    .enroll-modal-overlay {\r\n        position: fixed; top: 0; left: 0; width: 100%; height: 100vh;\r\n        background: rgba(0, 0, 0, 0.5); z-index: 999999 !important; \r\n        display: none; justify-content: center; align-items: center;\r\n        opacity: 0; transition: opacity 0.3s ease; padding: 20px;\r\n    }\r\n    \r\n    .enroll-modal-overlay.active { display: flex; opacity: 1; }\r\n\r\n    .enroll-glass-modal {\r\n        \/* GI\u1ea2M \u0110\u1ed8 \u0110\u1eacM M\u00c0U (ALPHA) XU\u1ed0NG C\u00d2N 0.3 \u0110\u1ec2 TRONG SU\u1ed0T H\u01a0N G\u1ea4P \u0110\u00d4I *\/\r\n        background: linear-gradient(135deg, rgba(160, 24, 48, 0.35), rgba(160, 24, 48, 0.15));\r\n        \r\n        \/* Gi\u1eef \u0111\u1ed9 m\u1edd h\u1eadu c\u1ea3nh m\u1ea1nh \u0111\u1ec3 Form kh\u00f4ng b\u1ecb r\u1ed1i *\/\r\n        backdrop-filter: blur(25px); \r\n        -webkit-backdrop-filter: blur(25px);\r\n        \r\n        width: 100%; max-width: 480px; border-radius: 25px; overflow: hidden;\r\n        border: 1px solid rgba(255,255,255,0.3); \r\n        box-shadow: 0 25px 50px rgba(0,0,0,0.3);\r\n        transform: scale(0.8); transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n        font-family: 'Segoe UI', sans-serif;\r\n    }\r\n    \r\n    .enroll-modal-overlay.active .enroll-glass-modal { transform: scale(1); }\r\n\r\n    .enroll-modal-header {\r\n        padding: 30px 30px 20px 30px; text-align: center; color: #fff; \r\n        border-bottom: 1px solid rgba(255,255,255,0.15); position: relative;\r\n    }\r\n\r\n    .enroll-close-btn {\r\n        position: absolute; top: 15px; right: 15px; font-size: 24px; color: #fff; cursor: pointer; \r\n        width: 32px; height: 32px; background: rgba(0,0,0,0.2); border-radius: 50%; \r\n        display: flex; align-items: center; justify-content: center; transition: 0.3s;\r\n    }\r\n    .enroll-close-btn:hover { background: rgba(255,255,255,0.2); transform: scale(1.1); }\r\n\r\n    .enroll-modal-header h2 { \r\n        margin: 0; font-size: 26px; text-transform: uppercase; letter-spacing: 1px; color: #fff;\r\n        text-shadow: 0 2px 10px rgba(0,0,0,0.3);\r\n    }\r\n    .enroll-modal-header p { color: rgba(255,255,255,0.9); font-size: 15px; margin: 8px 0 0 0; }\r\n\r\n    .enroll-modal-body { padding: 25px 30px 35px 30px; }\r\n\r\n    \/* \u00d4 nh\u1eadp li\u1ec7u trong su\u1ed1t nh\u1eb9 nh\u00e0ng \u0111\u1ec3 h\u00e0i h\u00f2a v\u1edbi t\u1ed5ng th\u1ec3 *\/\r\n    .enroll-modal-body input[type=\"text\"],\r\n    .enroll-modal-body input[type=\"email\"],\r\n    .enroll-modal-body input[type=\"tel\"],\r\n    .enroll-modal-body select {\r\n        width: 100%; padding: 14px 18px; margin-bottom: 16px;\r\n        background: rgba(255, 255, 255, 0.85); \r\n        border: 1px solid rgba(255,255,255,0.3); border-radius: 12px; font-size: 15px; color: #000;\r\n        box-sizing: border-box; font-family: inherit; transition: 0.3s;\r\n        outline: none;\r\n    }\r\n\r\n    .enroll-modal-body input:focus, \r\n    .enroll-modal-body select:focus {\r\n        background: #fff;\r\n        box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.3);\r\n    }\r\n\r\n    .enroll-modal-body .submit-btn {\r\n        background-color: #FFD700; color: #A01830; \r\n        padding: 16px; border: none; width: 100%; border-radius: 50px; \r\n        font-size: 16px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px;\r\n        cursor: pointer; transition: 0.3s; margin-top: 10px; \r\n        box-shadow: 0 8px 20px rgba(0,0,0,0.2);\r\n    }\r\n    .enroll-modal-body .submit-btn:hover { \r\n        background-color: #fff; transform: translateY(-3px); box-shadow: 0 12px 25px rgba(0,0,0,0.3); \r\n    }\r\n<\/style>\r\n\r\n<div class=\"hero-section\">\r\n    <div class=\"hero-glass-box\">\r\n        <h1 class=\"hero-title\">Welcome to Diva Beauty School<\/h1>\r\n        <p class=\"hero-desc\">\r\n            Start your dream career in Nail Technology, Cosmetology, Barbering, Hairstyling and Esthetics today!\r\n        <\/p>\r\n        \r\n        <a class=\"hero-btn\" onclick=\"openEnrollModal()\">Enroll Now<\/a>\r\n    <\/div>\r\n<\/div>\r\n\r\n<div id=\"modal-enroll\" class=\"enroll-modal-overlay\" onclick=\"closeEnrollModalClick(event)\">\r\n    <div class=\"enroll-glass-modal\">\r\n        <div class=\"enroll-modal-header\">\r\n            <div class=\"enroll-close-btn\" onclick=\"closeEnrollModal()\">\u00d7<\/div>\r\n            <h2>Enrollment<\/h2>\r\n            <p>Please fill out your information below<\/p>\r\n        <\/div>\r\n        \r\n        <div class=\"enroll-modal-body\">\r\n            \n<div class=\"wpcf7 no-js\" id=\"wpcf7-f479-o1\" lang=\"en-US\" dir=\"ltr\" data-wpcf7-id=\"479\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/vi\/wp-json\/wp\/v2\/pages\/40#wpcf7-f479-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Contact form\" novalidate=\"novalidate\" data-status=\"init\">\n<fieldset class=\"hidden-fields-container\"><input type=\"hidden\" name=\"_wpcf7\" value=\"479\" \/><input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.1.4\" \/><input type=\"hidden\" name=\"_wpcf7_locale\" value=\"en_US\" \/><input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f479-o1\" \/><input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/><input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<\/fieldset>\n<p><span class=\"wpcf7-form-control-wrap\" data-name=\"your-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Full Name\" value=\"\" type=\"text\" name=\"your-name\" \/><\/span><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Email Address\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-phone\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-tel wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-tel\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Phone Number\" value=\"\" type=\"tel\" name=\"your-phone\" \/><\/span><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-program\"><select class=\"wpcf7-form-control wpcf7-select wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" name=\"your-program\"><option value=\"\">Select Program<\/option><option value=\"Manicuring\">Manicuring<\/option><option value=\"Facial\">Facial<\/option><option value=\"Hairstyling\">Hairstyling<\/option><option value=\"Cosmetology\">Cosmetology<\/option><option value=\"Barbering\">Barbering<\/option><\/select><\/span><br \/>\n<input class=\"wpcf7-form-control wpcf7-submit has-spinner submit-btn\" type=\"submit\" value=\"Submit Application\" \/>\n<\/p><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\n    function openEnrollModal() {\r\n        document.getElementById('modal-enroll').classList.add('active');\r\n        document.body.style.overflow = 'hidden'; \r\n    }\r\n\r\n    function closeEnrollModal() {\r\n        document.getElementById('modal-enroll').classList.remove('active');\r\n        document.body.style.overflow = 'auto'; \r\n    }\r\n\r\n    function closeEnrollModalClick(event) {\r\n        if (event.target.classList.contains('enroll-modal-overlay')) {\r\n            event.target.classList.remove('active');\r\n            document.body.style.overflow = 'auto';\r\n        }\r\n    }\r\n\r\n    document.addEventListener('wpcf7mailsent', function(event) {\r\n        setTimeout(function() {\r\n            closeEnrollModal();\r\n        }, 2500); \r\n    }, false);\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fdc1329 e-flex e-con-boxed e-con e-parent\" data-id=\"fdc1329\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-db5e300 elementor-widget elementor-widget-html\" data-id=\"db5e300\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n    \/* --- C\u1ea4U TR\u00daC CHUNG --- *\/\r\n    .master-wrapper {\r\n        display: flex; align-items: center; justify-content: center;\r\n        max-width: 1250px; margin: 80px auto; padding: 0 20px;\r\n        font-family: 'Segoe UI', sans-serif; gap: 60px; \r\n    }\r\n\r\n    \/* =========================================\r\n       1. C\u1ed8T H\u00ccNH \u1ea2NH & N\u00daT G\u1eccI \u0110I\u1ec6N\r\n       ========================================= *\/\r\n    .complex-img-col {\r\n        flex: 1.2; position: relative; padding-left: 20px; margin-top: 40px;\r\n    }\r\n\r\n    .deco-pattern {\r\n        position: absolute; top: -30px; left: -10px; width: 100%; height: 100%;\r\n        background-image: radial-gradient(#C41E3A 1px, transparent 1px);\r\n        background-size: 20px 20px; opacity: 0.15; z-index: 0;\r\n    }\r\n\r\n    .main-photo-frame {\r\n        position: relative; z-index: 1; border-radius: 20px; overflow: hidden;\r\n        box-shadow: 10px 10px 40px rgba(0,0,0,0.12); \r\n    }\r\n    .hero-img {\r\n        width: 100%; height: auto; object-fit: contain; display: block;\r\n        transition: transform 0.7s ease;\r\n    }\r\n    .main-photo-frame:hover .hero-img { transform: scale(1.03); }\r\n\r\n    \/* LOGO XOAY *\/\r\n    .rotating-badge {\r\n        position: absolute; top: -45px; left: 50%; transform: translateX(-50%);\r\n        width: 90px; height: 90px; background: #fff; border-radius: 50%;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.15); z-index: 3; padding: 8px;\r\n    }\r\n    .badge-logo { \r\n        width: 100%; height: 100%; object-fit: contain; border-radius: 50%; \r\n        animation: spin-logo-only 15s linear infinite;\r\n    }\r\n    @keyframes spin-logo-only { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }\r\n\r\n    \/* TH\u1eba \u0110I\u1ec6N THO\u1ea0I C\u00d3 LINK G\u1eccI *\/\r\n    .phone-call-link {\r\n        text-decoration: none !important;\r\n        display: block;\r\n        position: absolute; bottom: 30px; left: -30px; z-index: 4;\r\n        transition: 0.3s;\r\n    }\r\n\r\n    .floating-phone-card {\r\n        background: rgba(255, 255, 255, 0.9); \r\n        backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);\r\n        padding: 12px 20px; border-radius: 12px;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.1); \r\n        border: 1px solid rgba(255,255,255,0.4);\r\n        border-left: 4px solid #C41E3A; \r\n        display: flex; align-items: center; gap: 12px;\r\n        animation: float-y 3s ease-in-out infinite;\r\n    }\r\n\r\n    .phone-call-link:hover .floating-phone-card {\r\n        transform: scale(1.08);\r\n        background: rgba(255, 255, 255, 1);\r\n        box-shadow: 0 15px 35px rgba(0,0,0,0.2);\r\n    }\r\n\r\n    @keyframes float-y { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }\r\n\r\n    .call-btn-circle {\r\n        width: 40px; height: 40px; background: #25D366; \r\n        border-radius: 50%; display: flex; align-items: center; justify-content: center;\r\n        color: white; box-shadow: 0 5px 15px rgba(37, 211, 102, 0.4);\r\n        animation: pulse-green 2s infinite;\r\n    }\r\n    @keyframes pulse-green { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); } 70% { box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); } 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } }\r\n\r\n    .phone-details h5 { margin: 0; font-size: 10px; color: #444; text-transform: uppercase; letter-spacing: 1px; font-weight: 700; }\r\n    .phone-details strong { font-size: 18px; color: #222; font-weight: 800; }\r\n\r\n    \/* =========================================\r\n       2. C\u1ed8T N\u1ed8I DUNG (TIMELINE)\r\n       ========================================= *\/\r\n    .complex-content-col { flex: 1; padding-left: 10px; }\r\n    .master-title { font-size: 38px; font-weight: 900; line-height: 1.2; margin-bottom: 45px; color: #222; }\r\n    .red-text { color: #C41E3A; position: relative; display: inline-block; }\r\n    .red-text::after {\r\n        content: ''; position: absolute; bottom: 5px; left: 0; width: 100%; height: 8px;\r\n        background: rgba(196, 30, 58, 0.1); z-index: -1;\r\n    }\r\n\r\n    .timeline-container {\r\n        position: relative; padding-left: 0; margin-left: 15px; \r\n        border-left: 2px dashed #e0e0e0;\r\n    }\r\n\r\n    .timeline-item {\r\n        position: relative; margin-bottom: 45px; padding-left: 40px; \r\n        transition: all 0.5s ease;\r\n        animation: flowDownRed 4s infinite; \r\n        opacity: 0.6; \r\n    }\r\n\r\n    .timeline-dot {\r\n        position: absolute; left: -9px !important; top: 5px;\r\n        width: 14px; height: 14px; background: #fff;\r\n        border: 3px solid #ccc; border-radius: 50%;\r\n        transition: all 0.3s; box-sizing: content-box;\r\n    }\r\n    \r\n    .item-header { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }\r\n    .item-icon-svg { width: 26px; height: 26px; fill: #C41E3A; opacity: 0.5; transition: 0.3s; }\r\n    .item-title { font-size: 20px; font-weight: 700; color: #333; margin: 0; transition: 0.3s; }\r\n    .item-desc { font-size: 15px; color: #666; margin: 0; line-height: 1.6; }\r\n\r\n    @keyframes flowDownRed { 0%, 100% { opacity: 0.6; transform: scale(1); } 25% { opacity: 1; transform: scale(1.02); } }\r\n    @keyframes dotGlow { 0%, 100% { border-color: #ccc; background: #fff; transform: scale(1); box-shadow: none; } 25% { border-color: #C41E3A; background: #C41E3A; transform: scale(1.3); box-shadow: 0 0 0 5px rgba(196, 30, 58, 0.2); } }\r\n    @keyframes textGlow { 0%, 100% { color: #333; } 25% { color: #C41E3A; } }\r\n    @keyframes iconGlow { 0%, 100% { opacity: 0.5; transform: scale(1); } 25% { opacity: 1; transform: scale(1.2); } }\r\n\r\n    .timeline-item:nth-child(1) { animation-delay: 0s; }\r\n    .timeline-item:nth-child(1) .timeline-dot { animation: dotGlow 4s infinite; animation-delay: 0s; }\r\n    .timeline-item:nth-child(1) .item-title { animation: textGlow 4s infinite; animation-delay: 0s; }\r\n    .timeline-item:nth-child(1) .item-icon-svg { animation: iconGlow 4s infinite; animation-delay: 0s; }\r\n\r\n    .timeline-item:nth-child(2) { animation-delay: 1.3s; }\r\n    .timeline-item:nth-child(2) .timeline-dot { animation: dotGlow 4s infinite; animation-delay: 1.3s; }\r\n    .timeline-item:nth-child(2) .item-title { animation: textGlow 4s infinite; animation-delay: 1.3s; }\r\n    .timeline-item:nth-child(2) .item-icon-svg { animation: iconGlow 4s infinite; animation-delay: 1.3s; }\r\n\r\n    .timeline-item:nth-child(3) { animation-delay: 2.6s; }\r\n    .timeline-item:nth-child(3) .timeline-dot { animation: dotGlow 4s infinite; animation-delay: 2.6s; }\r\n    .timeline-item:nth-child(3) .item-title { animation: textGlow 4s infinite; animation-delay: 2.6s; }\r\n    .timeline-item:nth-child(3) .item-icon-svg { animation: iconGlow 4s infinite; animation-delay: 2.6s; }\r\n\r\n    .timeline-item:hover { opacity: 1 !important; animation: none !important; }\r\n    .timeline-item:hover .timeline-dot { border-color: #C41E3A; background: #C41E3A; transform: scale(1.3); }\r\n\r\n    \/* RESPONSIVE *\/\r\n    @media (max-width: 900px) {\r\n        .master-wrapper { flex-direction: column-reverse; gap: 50px; margin-top: 40px; }\r\n        .phone-call-link { position: relative; left: 50%; transform: translateX(-50%); bottom: -20px; width: max-content; animation: none; }\r\n        .floating-phone-card { animation: none; background: rgba(255,255,255,0.95); }\r\n        .complex-img-col, .complex-content-col { padding: 0; width: 100%; }\r\n        .rotating-badge { top: -45px; width: 80px; height: 80px; } \r\n    }\r\n<\/style>\r\n\r\n<div class=\"master-wrapper\">\r\n    <div class=\"complex-img-col\">\r\n        <div class=\"deco-pattern\"><\/div>\r\n        <div class=\"main-photo-frame\">\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/IMG_20221201_092720.jpg\" \r\n                 class=\"hero-img\" alt=\"Diva Student\" loading=\"lazy\">\r\n        <\/div>\r\n        \r\n        <div class=\"rotating-badge\">\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Diva-Beauty-School-new-logo.jpg\" \r\n                 class=\"badge-logo\" alt=\"Logo\" loading=\"lazy\">\r\n        <\/div>\r\n        \r\n        <a href=\"tel:6693506389\" class=\"phone-call-link\">\r\n            <div class=\"floating-phone-card\">\r\n                <div class=\"call-btn-circle\">\r\n                    <svg style=\"width:22px;height:22px;fill:white\" viewBox=\"0 0 24 24\"><path d=\"M6.62,10.79C8.06,13.62 10.38,15.94 13.21,17.38L15.41,15.18C15.69,14.9 16.08,14.82 16.43,14.93C17.55,15.3 18.75,15.5 20,15.5A1,1 0 0,1 21,16.5V20A1,1 0 0,1 20,21A17,17 0 0,1 3,4A1,1 0 0,1 4,3H7.5A1,1 0 0,1 8.5,4C8.5,5.25 8.7,6.45 9.07,7.57C9.18,7.92 9.1,8.31 8.82,8.59L6.62,10.79Z\"\/><\/svg>\r\n                <\/div>\r\n                <div class=\"phone-details\">\r\n                    <h5>Admissions<\/h5>\r\n                    <strong>(669) 350-6389<\/strong>\r\n                <\/div>\r\n            <\/div>\r\n        <\/a>\r\n    <\/div>\r\n\r\n    <div class=\"complex-content-col\">\r\n        <h2 class=\"master-title\">\r\n            Launch your career <br> \r\n            at <span class=\"red-text\">Diva Beauty School<\/span>\r\n        <\/h2>\r\n        \r\n        <div class=\"timeline-container\">\r\n            <div class=\"timeline-item\">\r\n                <div class=\"timeline-dot\"><\/div>\r\n                <div class=\"item-header\">\r\n                    <svg class=\"item-icon-svg\" viewBox=\"0 0 24 24\"><path d=\"M12,2A10,10 0 1,0 22,12A10,10 0 0,0 12,2M16.2,16.2L11,13V7H12.5V12.2L17,14.9L16.2,16.2Z\"\/><\/svg>\r\n                    <h4 class=\"item-title\">Flexible Schedule<\/h4>\r\n                <\/div>\r\n                <p class=\"item-desc\">Full-time, Part-time, Day time & Evening classes available. Must be 17 years of age or older.<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"timeline-item\">\r\n                <div class=\"timeline-dot\"><\/div>\r\n                <div class=\"item-header\">\r\n                    <svg class=\"item-icon-svg\" viewBox=\"0 0 24 24\"><path d=\"M19,3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3M19,19H5V9H19V19M19,7H5V5H19V7Z\"\/><\/svg>\r\n                    <h4 class=\"item-title\">Enrollment is easy as 1, 2, 3<\/h4>\r\n                <\/div>\r\n                <p class=\"item-desc\">Ready to enroll? Visit our campus and talk to our academic advisor.<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"timeline-item\">\r\n                <div class=\"timeline-dot\"><\/div>\r\n                <div class=\"item-header\">\r\n                    <svg class=\"item-icon-svg\" viewBox=\"0 0 24 24\"><path d=\"M12,2A10,10 0 1,0 22,12A10,10 0 0,0 12,2M11,16.5L6,11.5L7.41,10.09L11,13.67L17.59,7.09L19,8.5L11,16.5Z\"\/><\/svg>\r\n                    <h4 class=\"item-title\">Classes start every month<\/h4>\r\n                <\/div>\r\n                <p class=\"item-desc\">School opens 7 days a week. Start your journey towards a beauty career anytime.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e165afe elementor-widget elementor-widget-html\" data-id=\"e165afe\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n    \/* ======================================================\r\n       PH\u1ea6N 1: TI\u00caU \u0110\u1ec0 PROGRAMS (GI\u1ed0NG M\u1eaaU - T\u00d4NG \u0110\u1ece \u0110\u00d4)\r\n       ====================================================== *\/\r\n    .programs-header {\r\n        text-align: center;\r\n        padding: 40px 10px 20px 10px;\r\n        font-family: 'Segoe UI', sans-serif;\r\n    }\r\n\r\n    .header-subtitle {\r\n        font-family: 'Cursive', 'Brush Script MT', cursive;\r\n        font-size: 24px;\r\n        color: #888; \/* M\u00e0u x\u00e1m nh\u1ea1t tinh t\u1ebf *\/\r\n        margin-bottom: 5px;\r\n        font-style: italic;\r\n    }\r\n\r\n    .header-main-title {\r\n        font-size: 48px;\r\n        font-weight: 800;\r\n        color: #A01830; \/* \u0110\u1ece \u0110\u00d4 T\u01af\u01a0I CH\u1ee6 \u0110\u1ea0O *\/\r\n        margin: 0;\r\n        text-transform: capitalize;\r\n    }\r\n\r\n    .header-divider {\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        margin-top: 15px;\r\n        gap: 20px;\r\n    }\r\n\r\n    .divider-line {\r\n        height: 1px;\r\n        width: 120px;\r\n        background-color: #ccc;\r\n    }\r\n\r\n    .flower-svg {\r\n        width: 35px;\r\n        height: 35px;\r\n        fill: #d1a3ff; \/* M\u00e0u t\u00edm c\u00e1nh hoa theo m\u1eabu *\/\r\n        opacity: 0.8;\r\n    }\r\n\r\n    \/* ======================================================\r\n       PH\u1ea6N 2: DANH S\u00c1CH 4 CH\u01af\u01a0NG TR\u00ccNH (PROGRAM CARDS)\r\n       ====================================================== *\/\r\n    .programs-section {\r\n        width: 100%; margin: 0 auto; padding: 20px 10px 40px 10px;\r\n        display: flex; flex-wrap: wrap; justify-content: center; gap: 20px;\r\n    }\r\n\r\n    .prog-card {\r\n        background: #fff; width: calc(25% - 20px); min-width: 250px;\r\n        border-radius: 20px; padding: 35px 20px; text-align: center;\r\n        position: relative; overflow: hidden;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: all 0.4s ease;\r\n        border: 1px solid #f0f0f0; display: flex; flex-direction: column;\r\n    }\r\n\r\n    .prog-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(160, 24, 48, 0.15); }\r\n\r\n    .prog-number-bg {\r\n        position: absolute; top: -15px; right: -5px; font-size: 90px; font-weight: 900;\r\n        color: rgba(160, 24, 48, 0.04); z-index: 0; pointer-events: none;\r\n    }\r\n\r\n    .prog-img-wrapper { position: relative; width: 140px; height: 140px; margin: 0 auto 25px auto; z-index: 1; }\r\n    \r\n    .prog-img { \r\n        width: 100% !important; height: 100% !important; object-fit: cover !important; \r\n        border-radius: 50% !important; border: 4px solid #fff; \r\n        box-shadow: 0 8px 20px rgba(0,0,0,0.15); position: relative; z-index: 2;\r\n    }\r\n\r\n    .prog-ring {\r\n        position: absolute; top: -5px; left: -5px; right: -5px; bottom: -5px; border-radius: 50%;\r\n        background: conic-gradient(from 0deg, #600010, #A01830, #ffcdd2, #A01830, #600010);\r\n        animation: spin-aura 4s linear infinite; z-index: 1;\r\n    }\r\n\r\n    @keyframes spin-aura { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }\r\n\r\n    .prog-title { font-size: 20px; font-weight: 700; color: #333; margin-bottom: 12px; text-transform: uppercase; }\r\n    \r\n    .prog-desc { font-size: 14px; color: #666; line-height: 1.6; margin-bottom: 25px; flex-grow: 1; }\r\n\r\n    .prog-btn {\r\n        display: inline-block; padding: 10px 30px; cursor: pointer;\r\n        color: #fff; font-weight: 700; text-decoration: none;\r\n        border-radius: 50px; background: #A01830; \r\n        transition: 0.3s; box-shadow: 0 4px 12px rgba(160, 24, 48, 0.3);\r\n        font-size: 14px; align-self: center;\r\n    }\r\n\r\n    .prog-btn:hover { background: #7a1224; transform: scale(1.05); box-shadow: 0 6px 18px rgba(160, 24, 48, 0.4); }\r\n\r\n    \/* ======================================================\r\n       PH\u1ea6N 3: MODAL (KHUNG K\u00cdNH TRONG SU\u1ed0T KHI B\u1ea4M XEM TH\u00caM)\r\n       ====================================================== *\/\r\n    .modal-overlay {\r\n        position: fixed; top: 0; left: 0; width: 100%; height: 100%;\r\n        background: rgba(0, 0, 0, 0.4); z-index: 999999; \r\n        display: none; justify-content: center; align-items: center;\r\n        opacity: 0; transition: opacity 0.3s ease; padding: 20px;\r\n    }\r\n    .modal-overlay.active { display: flex; opacity: 1; }\r\n    \r\n    .glass-modal {\r\n        background: linear-gradient(135deg, rgba(160, 24, 48, 0.8), rgba(160, 24, 48, 0.6));\r\n        backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);\r\n        width: 100%; max-width: 550px; border-radius: 25px; overflow: hidden;\r\n        border: 1px solid rgba(255,255,255,0.2); box-shadow: 0 25px 50px rgba(0,0,0,0.3);\r\n        transform: scale(0.8); transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n    }\r\n    .modal-overlay.active .glass-modal { transform: scale(1); }\r\n\r\n    .modal-header { padding: 30px; text-align: center; color: #fff; border-bottom: 1px solid rgba(255,255,255,0.1); position: relative; }\r\n    .close-modal-btn { position: absolute; top: 15px; right: 15px; font-size: 24px; color: #fff; cursor: pointer; width: 30px; height: 30px; background: rgba(0,0,0,0.2); border-radius: 50%; display: flex; align-items: center; justify-content: center; }\r\n    .modal-icon-large { width: 90px; height: 90px; border-radius: 50%; border: 3px solid #fff; object-fit: cover; margin-bottom: 15px; }\r\n    .modal-title-h2 { margin: 0; font-size: 24px; text-transform: uppercase; letter-spacing: 1px; }\r\n\r\n    .modal-body { padding: 30px; color: #fff; }\r\n    .detail-row { display: flex; align-items: flex-start; margin-bottom: 20px; }\r\n    .d-icon { font-size: 20px; margin-right: 15px; background: #fff; color: #A01830; width: 35px; height: 35px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }\r\n    .d-text strong { display: block; font-size: 16px; margin-bottom: 4px; color: #FFD700; }\r\n    .d-text span { font-size: 15px; opacity: 0.95; line-height: 1.5; }\r\n\r\n    @media (max-width: 900px) { .prog-card { width: 45%; } }\r\n    @media (max-width: 600px) { .prog-card { width: 100%; } .header-main-title { font-size: 36px; } }\r\n<\/style>\r\n\r\n<div class=\"programs-header\">\r\n    <div class=\"header-subtitle\">Diva Beauty School<\/div>\r\n    <h1 class=\"header-main-title\">Programs<\/h1>\r\n    <div class=\"header-divider\">\r\n        <div class=\"divider-line\"><\/div>\r\n        <div class=\"divider-icon\">\r\n            <svg class=\"flower-svg\" viewBox=\"0 0 24 24\">\r\n                <path d=\"M12,22C12,22 10,18 10,15C10,13.34 11.34,12 13,12C14.66,12 16,13.34 16,15C16,18 14,22 14,22H12M9,13C9,15 7,19 7,19C7,19 5,15 5,13C5,11.34 6.34,10 8,10C9.66,10 11,11.34 11,13C11,15 9,19 9,19M15,13C15,11.34 16.34,10 18,10C19.66,10 21,11.34 21,13C21,15 19,19 19,19C19,19 17,15 17,13C17,11.34 15.66,10 15,13M12,2C12,2 14,6 14,9C14,10.66 12.66,12 11,12C9.34,12 8,10.66 8,9C8,6 10,2 10,2H12Z\" \/>\r\n            <\/svg>\r\n        <\/div>\r\n        <div class=\"divider-line\"><\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<div class=\"programs-section\">\r\n    <div class=\"prog-card\">\r\n        <div class=\"prog-number-bg\">01<\/div>\r\n        <div class=\"prog-img-wrapper\">\r\n            <div class=\"prog-ring\"><\/div>\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/received_519088356516153.jpeg\" class=\"prog-img\">\r\n        <\/div>\r\n        <h3 class=\"prog-title\">Manicuring<\/h3>\r\n        <p class=\"prog-desc\">Manicuring is a 400 clocked hour course. Learn to perform nail skills professionally.<\/p>\r\n        <a class=\"prog-btn\" onclick=\"openProgModal('mani')\">Read More<\/a>\r\n    <\/div>\r\n\r\n    <div class=\"prog-card\">\r\n        <div class=\"prog-number-bg\">02<\/div>\r\n        <div class=\"prog-img-wrapper\">\r\n            <div class=\"prog-ring\"><\/div>\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/IMG_20231025_093752.jpg\" class=\"prog-img\">\r\n        <\/div>\r\n        <h3 class=\"prog-title\">Esthetics<\/h3>\r\n        <p class=\"prog-desc\">Esthetics (skin care) is a 600 clocked hour course covering all aspects of skin therapy.<\/p>\r\n        <a class=\"prog-btn\" onclick=\"openProgModal('esth')\">Read More<\/a>\r\n    <\/div>\r\n\r\n    <div class=\"prog-card\">\r\n        <div class=\"prog-number-bg\">03<\/div>\r\n        <div class=\"prog-img-wrapper\">\r\n            <div class=\"prog-ring\"><\/div>\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/program02.jpg\" class=\"prog-img\">\r\n        <\/div>\r\n        <h3 class=\"prog-title\">Barbering<\/h3>\r\n        <p class=\"prog-desc\">Barbering is a 1000 clocked hour course covering hair cutting and grooming techniques.<\/p>\r\n        <a class=\"prog-btn\" onclick=\"openProgModal('barb')\">Read More<\/a>\r\n    <\/div>\r\n\r\n    <div class=\"prog-card\">\r\n        <div class=\"prog-number-bg\">04<\/div>\r\n        <div class=\"prog-img-wrapper\">\r\n            <div class=\"prog-ring\"><\/div>\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/IMG_20221201_092508-scaled.jpg\" class=\"prog-img\">\r\n        <\/div>\r\n        <h3 class=\"prog-title\">Cosmetology<\/h3>\r\n        <p class=\"prog-desc\">Cosmetology is a 1000 clocked hour course covering theory and practical beauty training.<\/p>\r\n        <a class=\"prog-btn\" onclick=\"openProgModal('cosmo')\">Read More<\/a>\r\n    <\/div>\r\n<\/div>\r\n\r\n<div id=\"modal-mani\" class=\"modal-overlay\" onclick=\"closeProgModalClick(event)\">\r\n    <div class=\"glass-modal\">\r\n        <div class=\"modal-header\">\r\n            <div class=\"close-modal-btn\" onclick=\"closeProgModalById('modal-mani')\">\u00d7<\/div>\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/received_519088356516153.jpeg\" class=\"modal-icon-large\">\r\n            <h2 class=\"modal-title-h2\">Manicuring<\/h2>\r\n        <\/div>\r\n        <div class=\"modal-body\">\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\u23f1<\/div><div class=\"d-text\"><strong>Duration<\/strong><span>400 Clocked Hours<\/span><\/div><\/div>\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\ud83d\udcdc<\/div><div class=\"d-text\"><strong>Requirement<\/strong><span>Required by the California Board to apply for the license exam.<\/span><\/div><\/div>\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\ud83d\udc85<\/div><div class=\"d-text\"><strong>Skills<\/strong><span>Manicures, pedicures, artificial nails, massaging, and more.<\/span><\/div><\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<div id=\"modal-esth\" class=\"modal-overlay\" onclick=\"closeProgModalClick(event)\">\r\n    <div class=\"glass-modal\">\r\n        <div class=\"modal-header\">\r\n            <div class=\"close-modal-btn\" onclick=\"closeProgModalById('modal-esth')\">\u00d7<\/div>\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/IMG_20231025_093752.jpg\" class=\"modal-icon-large\">\r\n            <h2 class=\"modal-title-h2\">Esthetics<\/h2>\r\n        <\/div>\r\n        <div class=\"modal-body\">\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\u23f1<\/div><div class=\"d-text\"><strong>Duration<\/strong><span>600 Clocked Hours<\/span><\/div><\/div>\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\ud83d\udcdc<\/div><div class=\"d-text\"><strong>Requirement<\/strong><span>Standard for California State Board licensing.<\/span><\/div><\/div>\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\ud83d\udc86\u200d\u2640\ufe0f<\/div><div class=\"d-text\"><strong>Skills<\/strong><span>Comprehensive skin care, facials, and technical instruction.<\/span><\/div><\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<div id=\"modal-barb\" class=\"modal-overlay\" onclick=\"closeProgModalClick(event)\">\r\n    <div class=\"glass-modal\">\r\n        <div class=\"modal-header\">\r\n            <div class=\"close-modal-btn\" onclick=\"closeProgModalById('modal-barb')\">\u00d7<\/div>\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/program02.jpg\" class=\"modal-icon-large\">\r\n            <h2 class=\"modal-title-h2\">Barbering<\/h2>\r\n        <\/div>\r\n        <div class=\"modal-body\">\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\u23f1<\/div><div class=\"d-text\"><strong>Duration<\/strong><span>1000 Clocked Hours<\/span><\/div><\/div>\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\ud83d\udcdc<\/div><div class=\"d-text\"><strong>Requirement<\/strong><span>Preparation for State Board examination.<\/span><\/div><\/div>\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\ud83d\udc88<\/div><div class=\"d-text\"><strong>Skills<\/strong><span>Haircutting, shaving, grooming, and technical theory.<\/span><\/div><\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<div id=\"modal-cosmo\" class=\"modal-overlay\" onclick=\"closeProgModalClick(event)\">\r\n    <div class=\"glass-modal\">\r\n        <div class=\"modal-header\">\r\n            <div class=\"close-modal-btn\" onclick=\"closeProgModalById('modal-cosmo')\">\u00d7<\/div>\r\n            <img decoding=\"async\" src=\"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/IMG_20221201_092508-scaled.jpg\" class=\"modal-icon-large\">\r\n            <h2 class=\"modal-title-h2\">Cosmetology<\/h2>\r\n        <\/div>\r\n        <div class=\"modal-body\">\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\u23f1<\/div><div class=\"d-text\"><strong>Duration<\/strong><span>1000 Clocked Hours<\/span><\/div><\/div>\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\ud83d\udcdc<\/div><div class=\"d-text\"><strong>Requirement<\/strong><span>Mandatory for California Cosmetology licensing.<\/span><\/div><\/div>\r\n            <div class=\"detail-row\"><div class=\"d-icon\">\u2702\ufe0f<\/div><div class=\"d-text\"><strong>Skills<\/strong><span>Hair, skin, and nails: coloring, styling, facials, and waxing.<\/span><\/div><\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\n    function openProgModal(id) {\r\n        document.getElementById('modal-' + id).classList.add('active');\r\n        document.body.style.overflow = 'hidden';\r\n    }\r\n    function closeProgModalById(id) {\r\n        document.getElementById(id).classList.remove('active');\r\n        document.body.style.overflow = 'auto';\r\n    }\r\n    function closeProgModalClick(event) {\r\n        if (event.target.classList.contains('modal-overlay')) {\r\n            event.target.classList.remove('active');\r\n            document.body.style.overflow = 'auto';\r\n        }\r\n    }\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e24d78e elementor-widget elementor-widget-html\" data-id=\"e24d78e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n    \/* ======================================================\r\n       STYLE GI\u1eee NGUY\u00caN - CH\u1ec8 B\u1ece THANH LOADING\r\n       ====================================================== *\/\r\n    .services-header { text-align: center; padding: 40px 10px 10px; font-family: 'Segoe UI', sans-serif; background: transparent; }\r\n    .header-subtitle { font-family: 'Cursive', 'Brush Script MT', cursive; font-size: 22px; color: #999; margin-bottom: 5px; font-style: italic; }\r\n    .header-main-title { font-size: 42px; font-weight: 800; color: #A01830; margin: 0; letter-spacing: -1px; }\r\n    .header-divider-simple { display: flex; align-items: center; justify-content: center; margin-top: 15px; margin-bottom: 10px; }\r\n    .divider-line-long { height: 1px; width: 250px; background-color: rgba(0,0,0,0.1); }\r\n    .services-note { font-size: 15px; color: #666; margin-top: 10px; font-weight: 400; }\r\n\r\n    .services-widget { max-width: 1000px; margin: 0 auto; padding: 20px; font-family: 'Segoe UI', sans-serif; }\r\n    \r\n    .svc-tabs { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-bottom: 30px; }\r\n    \r\n    .svc-tab-btn {\r\n        padding: 10px 22px; border: 1px solid rgba(160, 24, 48, 0.2);\r\n        background: #fff; border-radius: 30px; cursor: pointer;\r\n        font-size: 13px; font-weight: 600; color: #555;\r\n        transition: 0.3s; text-transform: uppercase; \r\n        \/* \u0110\u00e3 b\u1ecf thu\u1ed9c t\u00ednh overflow v\u00e0 position relative kh\u00f4ng c\u1ea7n thi\u1ebft *\/\r\n    }\r\n    \r\n    .svc-tab-btn:hover {\r\n        background: #fff0f5; color: #A01830;\r\n    }\r\n\r\n    .svc-tab-btn.active {\r\n        background: #A01830; color: #fff; border-color: #A01830;\r\n        box-shadow: 0 4px 12px rgba(160, 24, 48, 0.3); \r\n        transform: scale(1.05);\r\n    }\r\n    \r\n    \/* \u0110\u00c3 X\u00d3A CODE THANH LOADING (::after) \u1ede \u0110\u00c2Y *\/\r\n\r\n    .svc-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 40px; row-gap: 5px; min-height: 200px; }\r\n    .svc-item { display: flex; justify-content: space-between; padding: 12px 15px; border-bottom: 1px dashed rgba(0,0,0,0.05); border-radius: 8px; transition: 0.2s; }\r\n    .svc-item:hover { background-color: rgba(255, 255, 255, 0.5); transform: scale(1.01); }\r\n    .svc-name { font-size: 15px; color: #333; font-weight: 500; }\r\n    .svc-price { font-size: 16px; font-weight: bold; color: #A01830; font-style: italic; }\r\n\r\n    @media (max-width: 768px) { .svc-grid { grid-template-columns: 1fr; } .header-main-title { font-size: 32px; } }\r\n<\/style>\r\n\r\n<div class=\"services-header\">\r\n    <div class=\"header-subtitle\">Diva Beauty School<\/div>\r\n    <h1 class=\"header-main-title\">Our Services<\/h1>\r\n    <div class=\"header-divider-simple\"><div class=\"divider-line-long\"><\/div><\/div>\r\n    <p class=\"services-note\">All services are done by students and supervised by an instructor<\/p>\r\n<\/div>\r\n\r\n<div id=\"service-widget-container\" class=\"services-widget is-playing\">\r\n    <div class=\"svc-tabs\">\r\n        <button class=\"svc-tab-btn\" id=\"btn-Haircuts\" onclick=\"manualSelect('Haircuts')\">Haircuts & Styling<\/button>\r\n        <button class=\"svc-tab-btn\" id=\"btn-Color\" onclick=\"manualSelect('Color')\">Color<\/button>\r\n        <button class=\"svc-tab-btn\" id=\"btn-Perm\" onclick=\"manualSelect('Perm')\">Perm<\/button>\r\n        <button class=\"svc-tab-btn\" id=\"btn-Manicure\" onclick=\"manualSelect('Manicure')\">Manicure<\/button>\r\n        <button class=\"svc-tab-btn\" id=\"btn-Pedicure\" onclick=\"manualSelect('Pedicure')\">Pedicure<\/button>\r\n        <button class=\"svc-tab-btn\" id=\"btn-Makeup\" onclick=\"manualSelect('Makeup')\">Skin Care\/Makeup<\/button>\r\n        <button class=\"svc-tab-btn\" id=\"btn-Waxing\" onclick=\"manualSelect('Waxing')\">Waxing<\/button>\r\n    <\/div>\r\n\r\n    <div id=\"service-container\" class=\"svc-grid\"><\/div>\r\n<\/div>\r\n\r\n<script>\r\n    const MENU_DATA = {\r\n        'Haircuts': [\r\n            {n: \"Cut & Style\", p: \"$15.00\"}, {n: \"Women Haircut\", p: \"$12.00\"},\r\n            {n: \"Men Haircut\", p: \"$7.00\"}, {n: \"Blow-Dry & Style\", p: \"$15.00\"},\r\n            {n: \"Updo\", p: \"$20.00\"}, {n: \"Bang\/beard trim\", p: \"$6.00\"}\r\n        ],\r\n        'Color': [\r\n            {n: \"Basic Color\", p: \"$25.00+\"}, {n: \"Partial Foil Weave\", p: \"$35.00+\"},\r\n            {n: \"Full Foil Weave\", p: \"$50.00+\"}, {n: \"Toner\", p: \"$15.00+\"},\r\n            {n: \"Bleach & Tone\", p: \"$50.00+\"}, {n: \"Retouch\", p: \"$25.00+\"}\r\n        ],\r\n        'Perm': [\r\n            {n: \"Short hair\", p: \"$30.00+\"}, {n: \"Medium hair\", p: \"$40.00+\"},\r\n            {n: \"Long hair\", p: \"$50.00+\"}, {n: \"Spiral perm\", p: \"$65.00+\"}\r\n        ],\r\n        'Manicure': [\r\n            {n: \"Manicure\", p: \"$10.00\"}, {n: \"Gel Manicure\", p: \"$20.00\"},\r\n            {n: \"Nail Enhancement\", p: \"$25.00\"}, {n: \"Fills\", p: \"$18.00\"},\r\n            {n: \"Design\", p: \"$5.00+\"}, {n: \"Nail Repair\", p: \"$3.00\"}\r\n        ],\r\n        'Pedicure': [\r\n            {n: \"Pedicure\", p: \"$15.00\"}, {n: \"Gel Pedicure\", p: \"$25.00\"},\r\n            {n: \"Spa Pedicure\", p: \"$20.00\"}, {n: \"Polish change\", p: \"$7.00\"}\r\n        ],\r\n        'Makeup': [\r\n            {n: \"Facial\", p: \"$20.00\"}, {n: \"Microdermabrasion\", p: \"$40.00\"},\r\n            {n: \"Chemical Peel\", p: \"$30.00\"}, {n: \"Makeup Application\", p: \"$15.00\"},\r\n            {n: \"Eyelash application\", p: \"$10.00\"}\r\n        ],\r\n        'Waxing': [\r\n            {n: \"Eyebrow Arch\", p: \"$7.00\"}, {n: \"Lip\/Chin\", p: \"$5.00\"},\r\n            {n: \"Full Face\", p: \"$15.00\"}, {n: \"Half Arm\", p: \"$15.00\"},\r\n            {n: \"Full Arm\", p: \"$25.00\"}, {n: \"Underarms\", p: \"$15.00\"},\r\n            {n: \"Half Leg\", p: \"$20.00\"}, {n: \"Full Leg\", p: \"$35.00\"}\r\n        ]\r\n    };\r\n\r\n    const CATEGORIES = Object.keys(MENU_DATA);\r\n    let currentIndex = 0;\r\n    let autoPlayInterval;\r\n    let isAutoPlaying = false; \r\n    const containerWidget = document.getElementById('service-widget-container');\r\n\r\n    function renderService(category) {\r\n        document.querySelectorAll('.svc-tab-btn').forEach(btn => btn.classList.remove('active'));\r\n        const activeBtn = document.getElementById('btn-' + category);\r\n        if(activeBtn) activeBtn.classList.add('active');\r\n\r\n        const container = document.getElementById('service-container');\r\n        container.style.opacity = 0;\r\n        \r\n        setTimeout(() => {\r\n            const items = MENU_DATA[category] || [];\r\n            container.innerHTML = items.map(item => \r\n                `<div class=\"svc-item\"><span class=\"svc-name\">${item.n}<\/span><span class=\"svc-price\">${item.p}<\/span><\/div>`\r\n            ).join('');\r\n            container.style.opacity = 1;\r\n        }, 150);\r\n    }\r\n\r\n    function nextSlide() {\r\n        if(!isAutoPlaying) return;\r\n        renderService(CATEGORIES[currentIndex]);\r\n        currentIndex = (currentIndex + 1) % CATEGORIES.length;\r\n    }\r\n\r\n    function manualSelect(category) {\r\n        isAutoPlaying = false;\r\n        clearInterval(autoPlayInterval);\r\n        containerWidget.classList.remove('is-playing');\r\n        currentIndex = CATEGORIES.indexOf(category);\r\n        renderService(category);\r\n    }\r\n\r\n    \/\/ T\u1ed0I \u01afU H\u00d3A: Ch\u1ec9 ch\u1ea1y khi nh\u00ecn th\u1ea5y (Lazy View)\r\n    document.addEventListener(\"DOMContentLoaded\", function() {\r\n        renderService(CATEGORIES[0]);\r\n        currentIndex = 1;\r\n\r\n        const observer = new IntersectionObserver((entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    if (!autoPlayInterval && containerWidget.classList.contains('is-playing')) {\r\n                        isAutoPlaying = true;\r\n                        autoPlayInterval = setInterval(nextSlide, 3000); \/\/ 3 gi\u00e2y \u0111\u1ed5i 1 l\u1ea7n\r\n                    }\r\n                } else {\r\n                    isAutoPlaying = false;\r\n                    clearInterval(autoPlayInterval);\r\n                    autoPlayInterval = null;\r\n                }\r\n            });\r\n        }, { threshold: 0.3 });\r\n\r\n        observer.observe(containerWidget);\r\n    });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-191f740 e-flex e-con-boxed e-con e-parent\" data-id=\"191f740\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-441ecca elementor-widget elementor-widget-html\" data-id=\"441ecca\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<script>\r\n    \/\/ Bi\u1ebfn ki\u1ec3m so\u00e1t \u0111\u1ec3 Pop-up ch\u1ec9 t\u1ef1 \u0111\u1ed9ng hi\u1ec7n ra 1 l\u1ea7n duy nh\u1ea5t m\u1ed7i l\u1ea7n t\u1ea3i trang\r\n    let hasAutoOpened = false;\r\n\r\n    window.addEventListener(\"scroll\", function() {\r\n        \/\/ 1. T\u00ednh to\u00e1n v\u1ecb tr\u00ed cu\u1ed9n c\u1ee7a ng\u01b0\u1eddi d\u00f9ng\r\n        let scrollTop = window.scrollY; \/\/ Kho\u1ea3ng c\u00e1ch \u0111\u00e3 cu\u1ed9n t\u1eeb \u0111\u1ec9nh trang\r\n        let docHeight = document.documentElement.scrollHeight; \/\/ T\u1ed5ng chi\u1ec1u cao c\u1ee7a to\u00e0n b\u1ed9 trang web\r\n        let winHeight = window.innerHeight; \/\/ Chi\u1ec1u cao m\u00e0n h\u00ecnh c\u1ee7a ng\u01b0\u1eddi \u0111ang xem\r\n        \r\n        \/\/ 2. Chuy\u1ec3n \u0111\u1ed5i sang \u0111\u01a1n v\u1ecb ph\u1ea7n tr\u0103m (%)\r\n        let scrollPercent = (scrollTop \/ (docHeight - winHeight)) * 100;\r\n\r\n        \/\/ 3. N\u1ebfu ng\u01b0\u1eddi d\u00f9ng cu\u1ed9n qu\u00e1 20% v\u00e0 ch\u01b0a t\u1eebng t\u1ef1 \u0111\u1ed9ng m\u1edf tr\u01b0\u1edbc \u0111\u00f3\r\n        if (scrollPercent >= 20 && !hasAutoOpened) {\r\n            \/\/ G\u1ecdi h\u00e0m m\u1edf Form (openEnrollModal) \u0111\u00e3 \u0111\u01b0\u1ee3c \u0111\u1ecbnh ngh\u0129a \u1edf kh\u1ed1i code banner\r\n            if (typeof openEnrollModal === \"function\") {\r\n                openEnrollModal(); \r\n                hasAutoOpened = true; \/\/ \u0110\u00e1nh d\u1ea5u l\u00e0 \u0111\u00e3 m\u1edf r\u1ed3i, kh\u00f4ng l\u00e0m phi\u1ec1n kh\u00e1ch n\u1eefa\r\n            }\r\n        }\r\n    });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-78a4bf9 elementor-widget elementor-widget-html\" data-id=\"78a4bf9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n    .fixed-call-button {\r\n        position: fixed;\r\n        bottom: 90px; \/* \u0110\u1ea9y l\u00ean cao \u0111\u1ec3 tr\u00e1nh m\u00fat m\u0169i t\u00ean *\/\r\n        right: 20px;\r\n        width: 60px;\r\n        height: 60px;\r\n        background-color: #25D366;\r\n        color: #fff;\r\n        border-radius: 50%;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        text-decoration: none !important;\r\n        z-index: 999999;\r\n        box-shadow: 0 4px 15px rgba(0,0,0,0.3);\r\n        transition: 0.3s;\r\n        animation: phone-pulse 2s infinite;\r\n    }\r\n\r\n    @keyframes phone-pulse {\r\n        0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); }\r\n        70% { box-shadow: 0 0 0 15px rgba(37, 211, 102, 0); }\r\n        100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }\r\n    }\r\n\r\n    .fixed-call-button svg {\r\n        width: 30px;\r\n        height: 30px;\r\n        fill: white;\r\n    }\r\n<\/style>\r\n\r\n<a href=\"tel:6693506389\" class=\"fixed-call-button\">\r\n    <svg viewBox=\"0 0 24 24\">\r\n        <path d=\"M6.62,10.79C8.06,13.62 10.38,15.94 13.21,17.38L15.41,15.18C15.69,14.9 16.08,14.82 16.43,14.93C17.55,15.3 18.75,15.5 20,15.5A1,1 0 0,1 21,16.5V20A1,1 0 0,1 20,21A17,17 0 0,1 3,4A1,1 0 0,1 4,3H7.5A1,1 0 0,1 8.5,4C8.5,5.25 8.7,6.45 9.07,7.57C9.18,7.92 9.1,8.31 8.82,8.59L6.62,10.79Z\"\/>\r\n    <\/svg>\r\n<\/a>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7796777 elementor-widget elementor-widget-html\" data-id=\"7796777\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n    \/* ======================================================\r\n       STYLE GIAO DI\u1ec6N (GI\u1eee NGUY\u00caN T\u00d4NG \u0110\u1ece \u0110\u00d4)\r\n       ====================================================== *\/\r\n    .flat-docs-section {\r\n        max-width: 800px; margin: 60px auto; padding: 20px;\r\n        font-family: 'Segoe UI', sans-serif; background: #fff;\r\n    }\r\n    .flat-header { text-align: center; margin-bottom: 40px; }\r\n    \r\n    .flat-title {\r\n        font-size: 28px; color: #901225; \/* \u0110\u1ecf \u0111\u00f4 ch\u1ee7 \u0111\u1ea1o *\/\r\n        font-weight: 800; text-transform: uppercase; letter-spacing: 1px; margin: 0;\r\n    }\r\n    .flat-divider {\r\n        width: 60px; height: 4px; background: #C41E3A; \/* \u0110\u1ecf t\u01b0\u01a1i nh\u1ea5n nh\u00e1 *\/\r\n        margin: 15px auto 0; border-radius: 2px;\r\n    }\r\n\r\n    .flat-list { display: flex; flex-direction: column; border-top: 1px solid #eee; }\r\n    \r\n    .flat-item {\r\n        display: flex; align-items: center; justify-content: center;\r\n        padding: 18px 20px; text-decoration: none; \r\n        border-bottom: 1px solid #eee; transition: all 0.2s ease;\r\n        cursor: pointer; text-align: center;\r\n    }\r\n    .flat-item:hover { background-color: #fff5f6; border-bottom-color: #ffcdd2; transform: translateX(5px); }\r\n    \r\n    .flat-name { font-size: 15px; color: #555; font-weight: 500; transition: color 0.2s; }\r\n    .flat-item:hover .flat-name { color: #C41E3A; font-weight: 700; }\r\n    \r\n    \/* --- POPUP PDF --- *\/\r\n    .ruby-modal-overlay {\r\n        display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%;\r\n        background: rgba(0, 0, 0, 0.8); z-index: 999999;\r\n        backdrop-filter: blur(5px); justify-content: center; align-items: center;\r\n        opacity: 0; transition: opacity 0.3s;\r\n    }\r\n    .ruby-modal-overlay.active { display: flex; opacity: 1; }\r\n\r\n    .ruby-modal-content {\r\n        position: relative; width: 95%; max-width: 900px; height: 90vh;\r\n        background: #333; border-radius: 12px;\r\n        box-shadow: 0 20px 50px rgba(0,0,0,0.5);\r\n        display: flex; flex-direction: column; overflow: hidden;\r\n        border: 1px solid rgba(255,255,255,0.2);\r\n    }\r\n\r\n    .ruby-close-btn {\r\n        position: absolute; top: 10px; right: 15px; color: #fff; font-size: 30px;\r\n        cursor: pointer; z-index: 50; line-height: 1; opacity: 0.8;\r\n    }\r\n    .ruby-close-btn:hover { opacity: 1; color: #ffeb3b; }\r\n\r\n    #ruby-pdf-container {\r\n        flex: 1; width: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch;\r\n        background: #444; padding: 20px 0; margin-top: 50px; text-align: center;\r\n    }\r\n\r\n    .pdf-page-canvas {\r\n        max-width: 100%; height: auto; margin: 0 auto 10px; display: block;\r\n        box-shadow: 0 4px 10px rgba(0,0,0,0.3);\r\n    }\r\n\r\n    .ruby-header-controls {\r\n        position: absolute; top: 0; left: 0; width: 100%; height: 50px;\r\n        background: rgba(144, 18, 37, 0.95); \/* Header m\u00e0u \u0111\u1ecf \u0111\u00f4 *\/\r\n        display: flex; align-items: center; padding-left: 20px; z-index: 10;\r\n        border-bottom: 1px solid rgba(255,255,255,0.1);\r\n    }\r\n    \r\n    .ruby-download-btn {\r\n        color: white; text-decoration: none; font-size: 13px; font-weight: 600;\r\n        background: rgba(0,0,0,0.3); padding: 6px 15px; border-radius: 4px;\r\n        border: 1px solid rgba(255,255,255,0.3); transition: 0.2s;\r\n    }\r\n    .ruby-download-btn:hover { background: #C41E3A; border-color: #C41E3A; }\r\n\r\n    .ruby-loading {\r\n        position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);\r\n        color: #fff; font-size: 16px; display: none; text-align: center;\r\n    }\r\n<\/style>\r\n\r\n<div class=\"flat-docs-section\">\r\n    <div class=\"flat-header\">\r\n        <h2 class=\"flat-title\">School Disclosures<\/h2>\r\n        <div class=\"flat-divider\"><\/div>\r\n    <\/div>\r\n    <div class=\"flat-list\" id=\"docs-list-render\">\r\n        <\/div>\r\n<\/div>\r\n\r\n<div class=\"ruby-modal-overlay\" id=\"rubyModal\" onclick=\"closeRubyPdf()\">\r\n    <div class=\"ruby-modal-content\" onclick=\"event.stopPropagation()\">\r\n        <span class=\"ruby-close-btn\" onclick=\"closeRubyPdf()\">&times;<\/span>\r\n        <div class=\"ruby-header-controls\">\r\n            <a href=\"#\" id=\"rubyDownloadLink\" class=\"ruby-download-btn\" target=\"_blank\">Download PDF<\/a>\r\n        <\/div>\r\n        \r\n        <div id=\"rubyLoading\" class=\"ruby-loading\">\r\n            <div style=\"margin-bottom:10px;\">\u23f3<\/div>\r\n            Loading Document...\r\n        <\/div>\r\n\r\n        <div id=\"ruby-pdf-container\"><\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\n    \/\/ --- 1. D\u1eee LI\u1ec6U T\u00c0I LI\u1ec6U ---\r\n    const DOCS_LIST = [\r\n        { name: \"Diva English Catalog\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Diva-English-Catalog.pdf\" },\r\n        { name: \"Diva Vietnamese Catalog\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Diva-Vietnamese-Catalog.pdf\" },\r\n        { name: \"Bureau for Private Postsecondary Education\", link: \"https:\/\/www.bppe.ca.gov\" },\r\n        { name: \"California Board of Barbering and Cosmetology\", link: \"https:\/\/www.barbercosmo.ca.gov\" },\r\n        { name: \"Manicuring School Performance Fact Sheet\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Manicuring-SCHOOL-PERFORMANCE-FACT-SHEET-1.pdf\" },\r\n        { name: \"Esthetics School Performance Fact Sheet\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/COMPLETED-2022-2023-ESTHETICS-SCHOOL-PERFORMANCE-FACT-SHEET.pdf\" },\r\n        { name: \"Hairstyling School Performance Fact Sheet\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Hairstyling-SCHOOL-PERFORMANCE-FACT-SHEET.pdf\" },\r\n        { name: \"VIET Manicuring BPPE School Performance Fact Sheet\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Manicuring-Viet-BPPE-SCHOOL-PERFORMANCE-FACT-SHEET.pdf\" },\r\n        { name: \"VIET Esthetics BPPE School Performance Fact Sheet\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Esthetics-Viet-BPPE-SCHOOL-PERFORMANCE-FACT-SHEET-.pdf\" },\r\n        { name: \"VIET Cosmetology BPPE School Performance Fact Sheet\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Cosmetology-Viet-BPPE-SCHOOL-PERFORMANCE-FACT-SHEET-.pdf\" },\r\n        { name: \"BPPE Annual Report\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Annual-Report.pdf\" },\r\n        { name: \"Disability Policy\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/DISABILITY-POLICY.pdf\" },\r\n        { name: \"Student's Right to Cancel\", link: \"https:\/\/divabeautycollege.com\/wp-content\/uploads\/2026\/01\/Students-Right-to-Cancel-6-06-21.pdf\" }\r\n    ];\r\n\r\n    \/\/ --- 2. HI\u1ec2N TH\u1eca DANH S\u00c1CH ---\r\n    document.addEventListener(\"DOMContentLoaded\", function() {\r\n        const container = document.getElementById(\"docs-list-render\");\r\n        container.innerHTML = \"\";\r\n        DOCS_LIST.forEach(item => {\r\n            const isPdf = item.link.toLowerCase().endsWith(\".pdf\") || item.link.toLowerCase().includes(\"uploads\");\r\n            const clickAction = isPdf ? `onclick=\"initPdfViewer('${item.link}')\"` : `onclick=\"window.open('${item.link}', '_blank')\"`;\r\n            \r\n            container.innerHTML += `\r\n                <div class=\"flat-item\" ${clickAction}>\r\n                    <span class=\"flat-name\">${item.name}<\/span>\r\n                <\/div>`;\r\n        });\r\n    });\r\n\r\n    \/\/ --- 3. X\u1eec L\u00dd T\u1ea2I TH\u01af VI\u1ec6N PDF TH\u00d4NG MINH (Lazy Load) ---\r\n    let pdfLibLoaded = false;\r\n    const PDF_LIB_URL = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/pdf.js\/3.11.174\/pdf.min.js';\r\n    const PDF_WORKER_URL = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/pdf.js\/3.11.174\/pdf.worker.min.js';\r\n\r\n    async function initPdfViewer(url) {\r\n        const modal = document.getElementById('rubyModal');\r\n        const loading = document.getElementById('rubyLoading');\r\n        const dlBtn = document.getElementById('rubyDownloadLink');\r\n        const pdfContainer = document.getElementById('ruby-pdf-container');\r\n\r\n        \/\/ Reset & Hi\u1ec7n Modal\r\n        pdfContainer.innerHTML = \"\";\r\n        dlBtn.href = url;\r\n        modal.classList.add('active');\r\n        loading.style.display = \"block\";\r\n\r\n        \/\/ Ki\u1ec3m tra xem \u0111\u00e3 t\u1ea3i th\u01b0 vi\u1ec7n ch\u01b0a\r\n        if (!window.pdfjsLib) {\r\n            loading.innerHTML = \"Downloading PDF Reader...\";\r\n            try {\r\n                \/\/ T\u1ef1 \u0111\u1ed9ng th\u00eam th\u1ebb script v\u00e0o web\r\n                await loadScript(PDF_LIB_URL);\r\n                window.pdfjsLib.GlobalWorkerOptions.workerSrc = PDF_WORKER_URL;\r\n                pdfLibLoaded = true;\r\n            } catch (e) {\r\n                loading.innerHTML = \"Error loading reader. Please download file.\";\r\n                return;\r\n            }\r\n        }\r\n\r\n        \/\/ B\u1eaft \u0111\u1ea7u v\u1ebd PDF\r\n        loading.innerHTML = \"Opening Document...\";\r\n        try {\r\n            const loadingTask = pdfjsLib.getDocument(url);\r\n            const pdf = await loadingTask.promise;\r\n            \r\n            loading.style.display = \"none\";\r\n\r\n            \/\/ V\u1ebd t\u1eebng trang (T\u1ed1i \u01b0u v\u00f2ng l\u1eb7p \u0111\u1ec3 kh\u00f4ng \u0111\u01a1 m\u00e1y)\r\n            for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {\r\n                const page = await pdf.getPage(pageNum);\r\n                \r\n                \/\/ T\u00ednh to\u00e1n t\u1ef7 l\u1ec7 zoom (V\u1eeba kh\u00edt m\u00e0n h\u00ecnh)\r\n                const viewportRaw = page.getViewport({ scale: 1 });\r\n                const desiredWidth = pdfContainer.clientWidth - 30;\r\n                const scale = desiredWidth \/ viewportRaw.width;\r\n                const viewport = page.getViewport({ scale: scale > 2 ? 2 : scale }); \/\/ Max zoom 2x\r\n\r\n                const canvas = document.createElement('canvas');\r\n                canvas.className = 'pdf-page-canvas';\r\n                const context = canvas.getContext('2d');\r\n                canvas.height = viewport.height;\r\n                canvas.width = viewport.width;\r\n                pdfContainer.appendChild(canvas);\r\n\r\n                await page.render({ canvasContext: context, viewport: viewport }).promise;\r\n            }\r\n        } catch (error) {\r\n            console.error(error);\r\n            loading.innerHTML = \"Cannot read file. Please use Download button.\";\r\n        }\r\n    }\r\n\r\n    \/\/ H\u00e0m h\u1ed7 tr\u1ee3 t\u1ea3i script \u0111\u1ed9ng\r\n    function loadScript(src) {\r\n        return new Promise((resolve, reject) => {\r\n            const script = document.createElement('script');\r\n            script.src = src;\r\n            script.onload = resolve;\r\n            script.onerror = reject;\r\n            document.head.appendChild(script);\r\n        });\r\n    }\r\n\r\n    function closeRubyPdf() {\r\n        document.getElementById('rubyModal').classList.remove('active');\r\n        \/\/ X\u00f3a b\u1ed9 nh\u1edb sau 0.5s \u0111\u1ec3 m\u01b0\u1ee3t m\u00e0\r\n        setTimeout(() => { document.getElementById('ruby-pdf-container').innerHTML = \"\"; }, 500);\r\n    }\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-32d42bc e-flex e-con-boxed e-con e-parent\" data-id=\"32d42bc\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-532457b elementor-widget elementor-widget-html\" data-id=\"532457b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n    \/* ======================================================\r\n       PH\u1ea6N 1: N\u1ec0N \"PASTEL SILK\" (H\u1ed2NG - XANH D\u01af\u01a0NG - XANH L\u00c1)\r\n       ====================================================== *\/\r\n    \r\n    \/* T\u1ea1o chuy\u1ec3n \u0111\u1ed9ng m\u01b0\u1ee3t m\u00e0 gi\u1eefa c\u00e1c m\u00e0u *\/\r\n    @keyframes silk-flow {\r\n        0% { background-position: 0% 50%; }\r\n        50% { background-position: 100% 50%; }\r\n        100% { background-position: 0% 50%; }\r\n    }\r\n\r\n    body, html, #page, .site, .site-content {\r\n        background-color: #FFF5F7; \/* M\u00e0u n\u1ec1n d\u1ef1 ph\u00f2ng *\/\r\n        \r\n        \/* PH\u1ed0I M\u00c0U M\u1edaI (\u0110A S\u1eaeC PASTEL) *\/\r\n        \/* Th\u1ee9 t\u1ef1 m\u00e0u: H\u1ed3ng ph\u1ea5n -> Xanh d\u01b0\u01a1ng nh\u1ea1t -> Xanh l\u00e1 nh\u1ea1t -> Tr\u1eafng -> L\u1eb7p l\u1ea1i H\u1ed3ng *\/\r\n        background-image: linear-gradient(-45deg, #FFDEE9, #D0E0FF, #E0F8E0, #FFFFFF, #FFDEE9);\r\n        \r\n        \/* Ph\u00f3ng to d\u1ea3i m\u00e0u \u0111\u1ec3 t\u1ea1o hi\u1ec7u \u1ee9ng tr\u00f4i ch\u1eadm *\/\r\n        background-size: 400% 400%;\r\n        \r\n        \/* Th\u1eddi gian chuy\u1ec3n \u0111\u1ed9ng (t\u0103ng l\u00ean 16s cho ch\u1eadm r\u00e3i, th\u01b0 gi\u00e3n h\u01a1n) *\/\r\n        animation: silk-flow 16s ease infinite;\r\n        \r\n        \/* C\u1ed1 \u0111\u1ecbnh n\u1ec1n \u0111\u1ec3 t\u1ea1o chi\u1ec1u s\u00e2u khi cu\u1ed9n *\/\r\n        background-attachment: fixed; \r\n    }\r\n\r\n    \/* --- QUAN TR\u1eccNG: L\u00e0m trong su\u1ed1t c\u00e1c l\u1edbp \u0111\u00e8 l\u00ean \u0111\u1ec3 th\u1ea5y n\u1ec1n m\u00e0u --- *\/\r\n    .site-header, .main-header-bar, .ast-primary-header-bar,\r\n    .ast-container, .site-content .ast-article-single, .entry-content,\r\n    .elementor-section, .elementor-column, .elementor-widget-wrap, .elementor-container,\r\n    div.elementor {\r\n        background-color: transparent !important;\r\n        background: transparent !important;\r\n        box-shadow: none !important;\r\n    }\r\n\r\n\r\n    \/* ======================================================\r\n       PH\u1ea6N 2: CH\u00c2N TRANG M\u1edaI (M\u00c0U \u0110\u1ece - GI\u1eee NGUY\u00caN)\r\n       ====================================================== *\/\r\n    \r\n    \/* \u1ea8n footer c\u0169 *\/\r\n    #colophon, .site-footer, .ast-footer-copyright { display: none !important; }\r\n\r\n    .diva-red-footer {\r\n        background-color: #901225 !important;\r\n        \r\n        \/* H\u1ecda ti\u1ebft ch\u00e9o m\u1edd nh\u1eb9 *\/\r\n        background-image: repeating-linear-gradient(\r\n            45deg,\r\n            rgba(255,255,255,0.02),\r\n            rgba(255,255,255,0.02) 10px,\r\n            transparent 10px,\r\n            transparent 20px\r\n        );\r\n        \r\n        color: #ffffff;\r\n        font-family: 'Segoe UI', sans-serif;\r\n        padding-top: 60px;\r\n        position: relative;\r\n        z-index: 999;\r\n        width: 100vw;\r\n        margin-left: calc(-50vw + 50%);\r\n        box-shadow: 0 -10px 30px rgba(0,0,0,0.15);\r\n    }\r\n\r\n    \/* B\u1ed0 C\u1ee4C *\/\r\n    .footer-container {\r\n        max-width: 1200px; margin: 0 auto; padding: 0 20px;\r\n        display: flex; flex-wrap: wrap; justify-content: space-between; gap: 40px;\r\n    }\r\n    .footer-col { flex: 1; min-width: 280px; }\r\n    \r\n    \/* LOGO *\/\r\n    .footer-logo-text {\r\n        font-size: 28px; font-weight: 800; text-transform: uppercase;\r\n        margin-bottom: 20px; color: #ffffff; letter-spacing: 1px;\r\n        display: inline-block; border-bottom: 2px solid rgba(255,255,255,0.3);\r\n        padding-bottom: 10px;\r\n        text-shadow: 2px 2px 4px rgba(0,0,0,0.4);\r\n    }\r\n    .footer-desc {\r\n        font-size: 15px; line-height: 1.6; color: rgba(255, 255, 255, 0.9);\r\n        margin-bottom: 25px;\r\n    }\r\n\r\n    \/* SOCIAL *\/\r\n    .footer-socials { display: flex; gap: 15px; }\r\n    .social-btn {\r\n        width: 40px; height: 40px; background: rgba(255, 255, 255, 0.1);\r\n        border: 1px solid rgba(255,255,255,0.2); border-radius: 50%;\r\n        display: flex; align-items: center; justify-content: center;\r\n        transition: 0.3s; text-decoration: none;\r\n    }\r\n    .social-btn svg { width: 20px; height: 20px; fill: #fff; }\r\n    .social-btn:hover { background: #fff; transform: translateY(-3px); }\r\n    .social-btn:hover svg { fill: #C41E3A; }\r\n\r\n    \/* TI\u00caU \u0110\u1ec0 *\/\r\n    .footer-heading {\r\n        font-size: 18px; font-weight: 700; text-transform: uppercase;\r\n        margin-bottom: 25px; color: #FFD700;\r\n        text-shadow: 1px 1px 2px rgba(0,0,0,0.6);\r\n    }\r\n\r\n    \/* LI\u00caN H\u1ec6 *\/\r\n    .contact-item {\r\n        display: flex; align-items: flex-start; gap: 15px;\r\n        margin-bottom: 20px; color: rgba(255,255,255,0.95);\r\n        font-size: 15px; line-height: 1.5;\r\n    }\r\n    .contact-icon {\r\n        width: 24px; min-width: 24px; height: 24px;\r\n        background: rgba(255,255,255,0.15); border-radius: 50%;\r\n        display: flex; align-items: center; justify-content: center; padding: 5px;\r\n    }\r\n    .contact-icon svg { width: 14px; height: 14px; fill: #fff; }\r\n    \r\n    .footer-phone-link { color: #fff; text-decoration: none; font-weight: bold; transition: 0.3s; }\r\n    .footer-phone-link:hover { color: #FFD700; }\r\n    \r\n    .hours-list {\r\n        margin: 0; padding: 0; list-style: none; \r\n        font-size: 14px; opacity: 0.9; margin-top: 5px;\r\n    }\r\n    .hours-list li { margin-bottom: 3px; display: flex; justify-content: space-between; width: 180px;}\r\n\r\n    \/* MAP *\/\r\n    .map-frame {\r\n        width: 100%; height: 250px;\r\n        border: 3px solid rgba(255,255,255,0.3); border-radius: 15px;\r\n        box-shadow: 0 15px 30px rgba(0,0,0,0.4);\r\n    }\r\n\r\n    \/* COPYRIGHT *\/\r\n    .footer-bottom {\r\n        background: rgba(0,0,0,0.2); margin-top: 50px; padding: 20px 0;\r\n        text-align: center; font-size: 14px; color: rgba(255,255,255,0.6);\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .footer-container { flex-direction: column; gap: 40px; }\r\n    }\r\n<\/style>\r\n\r\n<footer class=\"diva-red-footer\">\r\n    <div class=\"footer-container\">\r\n        <div class=\"footer-col\">\r\n            <div class=\"footer-logo-text\">Diva Beauty School<\/div>\r\n            <p class=\"footer-desc\">\r\n                Preparing students to pass the Board of Barbering and Cosmetology examination, gain employment, and be successful in their chosen field.\r\n            <\/p>\r\n            <div class=\"footer-socials\">\r\n                <a href=\"#\" class=\"social-btn\"><svg viewBox=\"0 0 24 24\"><path d=\"M12 2.04C6.5 2.04 2 6.53 2 12.06C2 17.06 5.66 21.21 10.44 21.96V14.96H7.9V12.06H10.44V9.85C10.44 7.34 11.93 5.96 14.15 5.96C15.21 5.96 16.16 6.05 16.16 6.05V8.51H15.03C13.78 8.51 13.4 9.28 13.4 10.09V12.06H16.17L15.73 14.96H13.4V21.96C18.19 21.21 22 17.06 22 12.06C22 6.53 17.5 2.04 12 2.04Z\"\/><\/svg><\/a>\r\n                <a href=\"#\" class=\"social-btn\"><svg viewBox=\"0 0 24 24\"><path d=\"M7.8,2H16.2C19.4,2 22,4.6 22,7.8V16.2A5.8,5.8 0 0,1 16.2,22H7.8C4.6,22 2,19.4 2,16.2V7.8A5.8,5.8 0 0,1 7.8,2M7.6,4A3.6,3.6 0 0,0 4,7.6V16.4C4,18.39 5.61,20 7.6,20H16.4A3.6,3.6 0 0,0 20,16.4V7.6C20,5.61 18.39,4 16.4,4H7.6M17.25,5.5A1.25,1.25 0 0,1 18.5,6.75A1.25,1.25 0 0,1 17.25,8A1.25,1.25 0 0,1 16,6.75A1.25,1.25 0 0,1 17.25,5.5M12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9Z\"\/><\/svg><\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"footer-col\">\r\n            <div class=\"footer-heading\">Contact Us<\/div>\r\n            <div class=\"contact-item\">\r\n                <div class=\"contact-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M12,11.5A2.5,2.5 0 0,1 9.5,9A2.5,2.5 0 0,1 12,6.5A2.5,2.5 0 0,1 14.5,9A2.5,2.5 0 0,1 12,11.5M12,2A7,7 0 0,0 5,9C5,14.25 12,22 12,22C12,22 19,14.25 19,9A7,7 0 0,0 12,2Z\"\/><\/svg><\/div>\r\n                <div>2298-A Quimby Road<br>San Jose, CA 95122<\/div>\r\n            <\/div>\r\n            <div class=\"contact-item\">\r\n                <div class=\"contact-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M6.62,10.79C8.06,13.62 10.38,15.94 13.21,17.38L15.41,15.18C15.69,14.9 16.08,14.82 16.43,14.93C17.55,15.3 18.75,15.5 20,15.5A1,1 0 0,1 21,16.5V20A1,1 0 0,1 20,21A17,17 0 0,1 3,4A1,1 0 0,1 4,3H7.5A1,1 0 0,1 8.5,4C8.5,5.25 8.7,6.45 9.07,7.57C9.18,7.92 9.1,8.31 8.82,8.59L6.62,10.79Z\"\/><\/svg><\/div>\r\n                <div><a href=\"tel:4086228180\" class=\"footer-phone-link\">(408) 622-8180<\/a><\/div>\r\n            <\/div>\r\n            <div class=\"contact-item\">\r\n                <div class=\"contact-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C6.47,22 2,17.5 2,12A10,10 0 0,1 12,2M12.5,7V12.25L17,14.92L16.25,16.15L11,13V7H12.5Z\"\/><\/svg><\/div>\r\n                <div>\r\n                    <strong>School Hours:<\/strong>\r\n                    <ul class=\"hours-list\">\r\n                        <li><span>Mon - Fri:<\/span> <span>8:00 AM - 9:00 PM<\/span><\/li>\r\n                        <li><span>Sat:<\/span> <span>8:00 AM - 4:00 PM<\/span><\/li>\r\n                        <li><span>Sun:<\/span> <span>10:00 AM - 4:00 PM<\/span><\/li>\r\n                    <\/ul>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"footer-col\">\r\n            <div class=\"footer-heading\">Our Location<\/div>\r\n            <iframe class=\"map-frame\" src=\"https:\/\/www.google.com\/maps\/embed?pb=!1m18!1m12!1m3!1d3171.1620378243655!2d-121.82298692363631!3d37.36268323581308!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x808fcd6c2136082f%3A0x413189186006595a!2s2298-A%20Quimby%20Rd%2C%20San%20Jose%2C%20CA%2095122%2C%20USA!5e0!3m2!1sen!2s!4v1708765432100!5m2!1sen!2s\" allowfullscreen=\"\" loading=\"lazy\" referrerpolicy=\"no-referrer-when-downgrade\"><\/iframe>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"footer-bottom\">\u00a9 2026 Diva Beauty School. All Rights Reserved.<\/div>\r\n<\/footer>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Welcome to Diva Beauty School Start your dream career in Nail Technology, Cosmetology, Barbering, Hairstyling and Esthetics today! Enroll Now [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-40","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/divabeautycollege.com\/vi\/wp-json\/wp\/v2\/pages\/40","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/divabeautycollege.com\/vi\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/divabeautycollege.com\/vi\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/divabeautycollege.com\/vi\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/divabeautycollege.com\/vi\/wp-json\/wp\/v2\/comments?post=40"}],"version-history":[{"count":289,"href":"https:\/\/divabeautycollege.com\/vi\/wp-json\/wp\/v2\/pages\/40\/revisions"}],"predecessor-version":[{"id":502,"href":"https:\/\/divabeautycollege.com\/vi\/wp-json\/wp\/v2\/pages\/40\/revisions\/502"}],"wp:attachment":[{"href":"https:\/\/divabeautycollege.com\/vi\/wp-json\/wp\/v2\/media?parent=40"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}