:root{--primary-red:#ff0000;--hover-red:#b30000;--dark-red:#b30000;--gold:#eec964;--white:#ffffff;--black:#000000;--light-gray:#cfcfcf;--medium-gray:#666666;--dark-gray:#151515;--body-bg:url('https://image.tolucafc.fxp.mx/lib/fe2e11747364057b7c1571/m/1/5bbc4062-399b-4401-b2de-b5e2d9f90083.jpg');--input-bg:rgba(0,0,0,0.35);--input-focus-bg:rgba(0,0,0,0.45);--container-bg:rgba(255,255,255,0.2);--footer-bg:var(--black);--font-primary:'Montserrat',sans-serif;--font-heading:'Fragor',sans-serif;--border-radius:10px;--spacing-sm:12px;--spacing-lg:32px;--spacing-xl:64px;--shadow:0 10px 30px rgba(0,0,0,0.25);--shadow-focus:0 0 0 0.25rem rgba(250,46,39,0.25);--transition-fast:0.15s ease-in-out;--transition-normal:0.2s ease}*{box-sizing:border-box}body{margin:0;font-family:var(--font-primary);background-image:var(--body-bg);background-size:cover;background-position:center;background-attachment:scroll;background-repeat:no-repeat;background-color:var(--black);min-height:100vh;color:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{margin:0 0 var(--spacing-lg) 0;font-weight:700}h1{font-size:clamp(2.5rem,1.875rem + 2vw,3rem);font-family:var(--font-heading);line-height:1.1;color:var(--white)}h2{font-size:clamp(2rem,1.375rem + 2vw,2.5rem);font-family:var(--font-heading);font-weight:normal;color:var(--white);text-shadow:2px 2px 4px rgb(0 0 0 / 47%)}h3{color:var(--dark-red)!important;font-size:clamp(1.8rem,1.55rem + 0.8vw,2rem);font-family:var(--font-heading);font-weight:700;line-height:1.2;color:var(--white)}p,li,label{font-family:var(--font-primary);font-size:clamp(0.9rem,0.65rem + 0.8vw,1.1rem);color:var(--white);margin:0 0 var(--spacing-sm) 0}span{font-family:var(--font-primary);color:black;font-weight:600}.container_full{min-height:100vh;height:auto;display:grid;grid-template-rows:auto 1fr auto}header{display:flex;justify-content:center;align-items:center;background:var(--black);box-shadow:var(--shadow);top:0;z-index:100}footer{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg) var(--spacing-lg);background:var(--footer-bg);box-shadow:0 -2px 8px rgba(0,0,0,0.04)}.footer-left img{height:100px;object-fit:contain;transition:transform var(--transition-normal)}.footer-right{display:flex;gap:var(--spacing-sm)}footer .link-fxp{display:table;width:auto;height:auto;background-color:transparent!important;margin:var(--spacing-sm) auto 0 auto;transition:opacity var(--transition-normal)}footer .link-fxp:hover{opacity:0.8}footer .link-fxp img.logo-fxp{max-width:200px;height:auto}.social{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--dark-gray)!important;color:var(--white);font-size:1.3rem;transition:color var(--transition-normal),transform var(--transition-normal),box-shadow var(--transition-normal);text-decoration:none;position:relative;overflow:hidden;will-change:transform}.social::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;background:var(--hover-red);border-radius:50%;transform:translate(-50%,-50%);transition:all var(--transition-normal);z-index:-1}.social:hover::before{width:100%;height:100%}.social:hover{color:var(--white);transform:translateY(-2px);box-shadow:var(--shadow)}.story-section{display:flex;flex-direction:column;justify-content:center;padding:var(--spacing-xl) var(--spacing-sm);flex:1}.story-section .container{border-radius:var(--border-radius);max-width:900px;margin:0 auto;backdrop-filter:blur(6px);box-shadow:var(--shadow);background:var(--container-bg);padding:var(--spacing-lg)}.p-content{max-width:730px;width:100%;margin:0 auto}.story-section h1{color:var(--gold);margin-bottom:var(--spacing-sm);text-align:center}.text-gold{color:var(--gold)}ol li{margin-bottom:0}.story-form{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);align-items:stretch;justify-content:center}label{width:100%;font-weight:600;margin-bottom:var(--spacing-sm)}.form-control,.story-form input[type="email"],.story-form input[type="text"],.story-form input[type="tel"],.story-form input[type="date"],.form-select,.story-form textarea{flex:1 1 320px;min-width:260px;border:2px solid rgba(255,255,255,0.3);border-radius:var(--border-radius);padding:14px 18px;background:var(--input-bg);color:var(--white);font-family:var(--font-primary);font-size:1rem;transition:border-color var(--transition-fast),background-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast);outline:none;will-change:transform}.form-control:hover,.story-form input:hover,.form-select:hover,.story-form textarea:hover{border-color:rgba(255,255,255,0.5);background:rgba(0,0,0,0.4)}.form-control:focus,.story-form input:focus,.form-select:focus,.story-form textarea:focus{color:var(--white);border-color:var(--primary-red);background:var(--input-focus-bg);box-shadow:var(--shadow-focus);transform:translateY(-1px)}.form-control::placeholder,.story-form input::placeholder,.story-form textarea::placeholder{color:var(--white);opacity:0.7;font-style:italic}.form-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;padding-right:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath fill='%23ffffff' d='M1.41.58 8 7.17 14.59.58 16 2l-8 8-8-8z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-color:var(--input-bg);color:var(--white);cursor:pointer}.form-select:hover,.form-select:focus,.form-select:active{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath fill='%23ffffff' d='M1.41.58 8 7.17 14.59.58 16 2l-8 8-8-8z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}.form-select option{color:#333;background:var(--white);padding:8px}.story-form input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(1);cursor:pointer;opacity:0.7;transition:opacity var(--transition-fast)}.story-form input[type="date"]::-webkit-calendar-picker-indicator:hover{opacity:1}.form-check-input{width:20px;height:20px;border:2px solid rgba(255,255,255,0.6);background:transparent;cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast);will-change:transform}.form-check-input:checked{background-color:var(--primary-red);border-color:var(--primary-red)}.form-check-input:focus{border-color:var(--primary-red);box-shadow:var(--shadow-focus)}.form-check-input:hover{border-color:var(--primary-red);transform:scale(1.05)}button{border:none;border-radius:var(--border-radius);padding:14px 32px;background:var(--primary-red);color:var(--white);font-weight:700;letter-spacing:0.5px;transition:background-color var(--transition-normal),transform var(--transition-normal),box-shadow var(--transition-normal);display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);text-decoration:none;font-family:var(--font-primary);font-size:1rem;cursor:pointer;position:relative;overflow:hidden;will-change:transform}button:hover{background:var(--dark-red);color:var(--white);transform:translateY(-2px);box-shadow:var(--shadow)}button:active{transform:translateY(0)}.btn{border-color:var(--white);padding:14px 32px;background:transparent;color:var(--white);display:inline-flex}.alert{border-radius:var(--border-radius);font-size:0.9rem;padding:var(--spacing-sm);border:1px solid transparent;backdrop-filter:blur(4px)}.alert-success{background-color:rgba(255,255,255,0.1);border-color:var(--primary-red);color:var(--white)}.error{margin-top:var(--spacing-sm);animation:shake 0.5s ease-in-out}@keyframes shake{0%,100%{transform:translate3d(0,0,0)}25%{transform:translate3d(-5px,0,0)}75%{transform:translate3d(5px,0,0)}}.spinner-border{margin-top:var(--spacing-sm);animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@media (max-width:768px){.social{width:36px;height:36px;font-size:1.1rem}}@media (max-width:650px){footer{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-sm)}.footer-left{width:100%;display:flex;justify-content:center;margin-bottom:var(--spacing-sm)}.footer-right{width:100%;justify-content:center;gap:var(--spacing-sm);margin-top:0}.social{width:32px;height:32px;font-size:1rem}}.slide{display:none;animation:fadeIn 0.3s ease-in-out}.slide.active{display:block}@keyframes fadeIn{from{opacity:0;transform:translate3d(0,20px,0)}to{opacity:1;transform:translate3d(0,0,0)}}.progress-container{position:relative;margin-bottom:2rem}.progress{height:8px;background-color:rgba(255,255,255,0.2);border-radius:4px;overflow:hidden}.progress-bar{background:linear-gradient(90deg,var(--primary-red),var(--gold));transition:width 0.3s ease;height:100%}.progress-dots{display:flex;justify-content:center;margin-top:1rem;gap:0.5rem}.dot{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,0.3);color:white;display:flex;align-items:center;justify-content:center;font-size:0.9rem;font-weight:bold;cursor:pointer;transition:all 0.3s ease}.dot.active{background:var(--primary-red);transform:scale(1.1)}.dot:hover:not(.active){background:rgba(255,255,255,0.5)}.form-check-group .form-check{margin-bottom:1rem;padding:1rem;border:2px solid rgba(255,255,255,0.2);border-radius:var(--border-radius);transition:all 0.3s ease;cursor:pointer;display:flex;align-items:flex-start;gap:0.75rem}.form-check-group .form-check .form-check-input{margin:0;margin-top:2px;flex-shrink:0}.form-check-group .form-check .form-check-label{margin:0;padding:0;flex:1;cursor:pointer;line-height:1.4}.form-check-group .form-check.disabled-option{opacity:0.5;border-color:rgba(255,255,255,0.1);background:rgba(255,255,255,0.02);cursor:not-allowed}.form-check-group .form-check.disabled-option .form-check-label{cursor:not-allowed;color:rgba(255,255,255,0.6)}.form-check-group .form-check.disabled-option .form-check-input{cursor:not-allowed}.form-check-group .form-check:hover{border-color:rgba(255,255,255,0.4);background:rgba(255,255,255,0.05)}.form-check-group .form-check.selected{border-color:var(--primary-red);background:rgba(250,46,39,0.1)}.form-check-input.is-valid{border-color:#28a745;background-color:#28a745}.form-check-input.is-invalid{border-color:#dc3545;background-color:#dc3545}.error-message{font-size:0.9rem;font-weight:600;animation:shake 0.5s ease-in-out}.btn-prev,.btn-next,.btn-submit{margin:0 0.5rem;padding:12px 24px;font-weight:600;transition:all 0.3s ease}.btn-prev{background:transparent;border:2px solid var(--white);color:var(--white)}.btn-prev:hover{background:var(--white);color:var(--black)}.btn-next,.btn-submit{background:var(--primary-red);border:2px solid var(--primary-red);color:var(--white)}.btn-submit{color:var(--black);background-color:var(--gold);border-color:var(--gold)}.btn-next:hover,.btn-submit:hover{color:var(--white);background:var(--hover-red);border-color:var(--hover-red);transform:translateY(-2px)}.success-message{padding:2rem;text-align:center}.results-summary{max-width:600px;margin:0 auto;text-align:left}.rounded-img{width:100%;border-radius:var(--border-radius);overflow:hidden;box-shadow:var(--shadow);transition:transform var(--transition-normal)}.rounded-img:hover{transform:scale(1.05)}@media (max-width:768px){.progress-dots{gap:0.25rem}.dot{width:28px;height:28px;font-size:0.8rem}.btn-prev,.btn-next,.btn-submit{display:block;width:100%;margin:0.5rem 0}.form-check-group .form-check{padding:0.75rem}}.result-title{font-family:var(--font-heading);font-size:clamp(2rem,5vw,2.5rem);color:var(--gold);text-align:center;margin-bottom:var(--spacing-sm)}.result-subtitle{font-family:var(--font-primary);font-size:clamp(1rem,2.5vw,1.35rem);font-weight:bold;margin-bottom:var(--spacing-lg);opacity:0.9}.score-section{margin:var(--spacing-lg) 0}.score-section h2,.score-section h3{font-family:var(--font-primary)}.score-title{font-family:var(--font-heading);font-size:clamp(1.5rem,4vw,1.8rem);margin-bottom:var(--spacing-sm)}.result-item{display:flex;align-items:center;margin:var(--spacing-sm) 0;padding:var(--spacing-sm);background:rgba(0,0,0,0.2);border-radius:var(--border-radius);font-size:clamp(1rem,2vw,1.1rem);transition:all var(--transition-normal);border:2px solid transparent}.result-item:hover{transform:translateX(4px)}.result-item.correct{border-left:4px solid #28a745;border-color:rgba(40,167,69,0.3);background:rgba(40,167,69,0.3)}.result-item.correct:hover{border-color:rgba(40,167,69,0.5);background:rgba(40,167,69,0.5)}.result-item.incorrect{border-left:4px solid #dc3545;border-color:rgba(220,53,69,0.3);background:rgba(220,53,69,0.3)}.result-item.incorrect:hover{border-color:rgba(220,53,69,0.5);background:rgba(220,53,69,0.5)}.result-icon{margin-right:var(--spacing-sm);font-size:clamp(1.1rem,2.5vw,1.2rem)}.play-again-btn{display:block;margin:var(--spacing-lg) auto 0;padding:16px 40px;font-size:clamp(1rem,2.5vw,1.1rem);background:var(--black);color:var(--white);border:none;border-radius:var(--border-radius);font-weight:700;cursor:pointer;text-decoration:none;transition:all var(--transition-normal)}.play-again-btn:hover{color:var(--white);background:var(--hover-red);transform:translateY(-2px);box-shadow:var(--shadow)}.final-message{text-align:center;margin-top:var(--spacing-lg);font-style:italic;opacity:0.8}@media (max-width:768px){.result-item{padding:calc(var(--spacing-sm) * 0.75)}.play-again-btn{width:100%;max-width:300px}}.checkbox-oculto{position:absolute;opacity:0;pointer-events:none}.objeto-seleccionable{position:relative;display:inline-block;cursor:pointer;transition:border-color 0.3s ease,transform 0.3s ease,box-shadow 0.3s ease}.col-md-4{display:flex;justify-content:center}.objeto-titulo{color:var(--white);font-weight:600;font-size:1rem;text-align:center;margin-top:0.5rem}.objeto-seleccionable img{border:3px solid rgba(255,255,255,0.3);transition:border-color 0.3s ease,transform 0.3s ease,box-shadow 0.3s ease;box-shadow:0 4px 12px rgba(0,0,0,0.2);will-change:transform}.objeto-seleccionable:hover img{border-color:rgba(255,255,255,0.6);transform:translate3d(0,-4px,0);box-shadow:0 8px 20px rgba(255,0,0,0.3)}.checkbox-oculto:checked + img,.objeto-seleccionable:has(.checkbox-oculto:checked) img{border-color:#ff0000;border-width:4px;box-shadow:0 0 0 4px rgba(255,0,0,0.2),0 8px 24px rgba(255,0,0,0.4);transform:scale(1.05)}.row{justify-content:center}@media (max-width:767px){.col-md-4{flex:0 0 50%;max-width:50%}}@media (max-width:439px){.col-md-4{flex:0 0 100%;max-width:100%}.row{justify-content:center}.objeto-seleccionable{display:flex;justify-content:center}.objeto-seleccionable img{max-width:200px}}
