.about-hero{position:relative;margin:0 auto var(--spacing-xl) auto;padding:var(--spacing-xl) var(--spacing-ml);text-align:center}.about-hero:before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(circle at center,var(--accent-300),var(--accent-300),var(--accent-200),transparent 97%);-webkit-mask-image:linear-gradient(transparent,#000 18%,#000 77%,transparent);mask-image:linear-gradient(transparent,#000 18%,#000 77%,transparent);pointer-events:none;opacity:.63}.about-hero-subtitle{font-family:var(--ff-italics);font-style:italic;font-size:var(--fz-xl);color:var(--primary-900)}.about-intro{padding-block:var(--spacing-l);margin-block-end:var(--spacing-xl)}.about-intro-content{max-width:65ch;margin-inline:auto;padding-inline:var(--spacing-m)}.about-intro-text{padding:var(--spacing-l);background-color:var(--secondary-100);font-size:var(--fz-ml);line-height:1.75;text-align:center;border-radius:var(--radius-m);border-block-start:var(--border-width-m) solid var(--accent-400);box-shadow:inset 0 2px 8px hsl(var(--shadow-color) / calc(var(--shadow-strength) + 9%)),var(--inner-shadow-highlight),var(--shadow-3)}.about-intro-text span:first-of-type{font-family:var(--ff-medium)}.about-intro-text span:last-of-type{display:inline-block;font-family:var(--ff-bold);font-weight:700}.about-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:var(--spacing-l);padding:var(--spacing-l) var(--spacing-m);margin-block-end:var(--spacing-xl)}.feature-card{position:relative;background-color:color-mix(in hsl,var(--secondary-100) 70%,transparent 30%);border-radius:var(--radius-m);padding:var(--spacing-l);border:var(--border-width-s) solid var(--secondary-400);box-shadow:var(--shadow-1);transition:translate var(--trs-s),box-shadow var(--trs-s),border-color var(--trs-s);overflow:hidden;cursor:default}.feature-card:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,var(--accent-100),var(--accent-400) 80%,var(--accent-100));scale:0 1;transform-origin:center;opacity:0;transition:scale var(--trs-m),opacity var(--trs-s);z-index:3}.feature-card:after{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--secondary-100),transparent 35%);background-size:100% 220%;background-position:50% 50%;transition:background-position var(--trs-l) 315ms;z-index:2}.feature-card:hover{translate:0 3.5px;box-shadow:none;border-color:var(--accent-300)}.feature-card:hover:before{scale:1 1;opacity:1}.feature-card:hover:after{background-position:50% 0%}.feature-card:hover .feature-card-icon{scale:1.7;rotate:0deg;opacity:.24;translate:-50% -65%;background-color:var(--accent-600)}.feature-card:hover .feature-card-title{opacity:1}.feature-card-icon{position:absolute;inset:50% auto auto 50%;height:148px;width:148px;scale:1.2;border-radius:var(--radius-m);background-color:var(--secondary-500);opacity:.28;translate:-50% -35%;rotate:5deg;transition:scale var(--trs-l) .23s,rotate var(--trs-l),translate var(--trs-l) .23s,background-color var(--trs-l),opacity var(--trs-l);z-index:1}.feature-card-icon.advice{mask:url(/ep-sonido-iluminacion/phone.svg) center / contain no-repeat}.feature-card-icon.technical{mask:url(/ep-sonido-iluminacion/tool.svg) center / contain no-repeat}.feature-card-icon.experience{mask:url(/ep-sonido-iluminacion/users.svg) center / contain no-repeat}.feature-card-title{position:relative;font-size:var(--fz-l);color:var(--primary-900);margin-block:0 var(--spacing-m);text-align:center;width:fit-content;margin-inline:auto;font-weight:600;font-variation-settings:"wght" 600;opacity:.86;transition:opacity var(--trs-l) .36s;z-index:3}.feature-card-description{position:relative;font-size:var(--fz-ml);z-index:3}@media only screen and (max-width: 900px){.feature-card:hover .feature-card-icon{scale:1.65}.feature-card-icon{height:124px;width:124px}.about-hero-subtitle{font-size:var(--fz-l)}.about-intro-text{font-size:var(--fz-m)}.feature-card-title{font-size:var(--fz-l)}.feature-card-description{font-size:var(--fz-m)}}@media screen and (max-width: 500px){.about-hero{margin:0 auto var(--spacing-ml) auto}.feature-card:hover .feature-card-icon{scale:1.6}.feature-card-icon{height:98px;width:98px}}@media only screen and (max-width: 450px){.about-hero-subtitle{font-size:var(--fz-mll)}.about-intro-text{font-size:var(--fz-ms)}.feature-card-title{font-size:var(--fz-ml)}.feature-card-description{font-size:var(--fz-ms)}}
