/*
Theme Name: Ola
Theme URI: https://www.mavsurfer.com/
Description: Tema propio de MavSurfer: fotos con borde de ola, tipografia Tilt Warp y Cabin.
Author: MavSurfer
Version: 1.0.1
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 8.1
License: GPLv2 or later
Text Domain: ola-mv
Update URI: false
*/
@font-face{font-family:"Tilt Warp";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/tilt-warp-400.woff2) format("woff2")}
@font-face{font-family:Cabin;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/cabin-400.woff2) format("woff2")}
@font-face{font-family:Cabin;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/cabin-600.woff2) format("woff2")}
@font-face{font-family:Cabin;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/cabin-700.woff2) format("woff2")}
:root{--ultra:#1C2BB5;--noche:#0E1658;--melo:#FFC4A3;--blanco:#fff;--gris:#4B5190;--hielo:#EEF0FF;--err:#9E1B1B;
--d:"Tilt Warp","Arial Rounded MT Bold",system-ui,sans-serif;--b:Cabin,system-ui,sans-serif;
--gl:max(16px,env(safe-area-inset-left,0px));--gr:max(16px,env(safe-area-inset-right,0px));
--wave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='24' viewBox='0 0 64 24'%3E%3Cpath d='M0 24V12Q16-4 32 12T64 12V24Z' fill='%23000'/%3E%3C/svg%3E")}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ultra);color:#fff;font:400 17px/1.55 var(--b);overflow-x:hidden}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}a:hover,a:focus-visible{text-decoration:underline;text-underline-offset:.2em}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--foco,var(--melo));outline-offset:3px}
h1,h2,h3,p,ul,ol,figure{margin:0}ul{list-style:none;padding:0}
.olm-skip{position:absolute;left:-999px;top:0;background:var(--melo);color:var(--noche);padding:10px 16px;z-index:100}
.olm-skip:focus{left:var(--gl)}
.olm-pad{padding-left:max(var(--gl),calc((100% - 1240px)/2 + 56px));padding-right:max(var(--gr),calc((100% - 1240px)/2 + 56px))}
@media(max-width:700px){.olm-pad{padding-left:var(--gl);padding-right:var(--gr)}}
.olm-top{display:flex;align-items:center;justify-content:space-between;gap:12px 28px;flex-wrap:wrap;padding-block:18px;position:relative;z-index:5}
.olm-logo{display:flex;align-items:center;gap:10px;font:400 28px/1 var(--d);letter-spacing:-.02em;text-transform:lowercase}
.olm-logo:hover{text-decoration:none}
.olm-nav{display:flex;gap:6px 24px;flex-wrap:wrap;font:600 16px var(--b);color:var(--melo)}
.olm-nav a[aria-current]{color:#fff;text-decoration:underline;text-underline-offset:.25em}
/* fotos con borde de ola */
.olm-ph{position:relative;display:block;overflow:hidden;background:linear-gradient(160deg,#6C7BFF,#FFB48A);
 -webkit-mask:linear-gradient(#000,#000) top/100% calc(100% - 22px) no-repeat,var(--wave) bottom/64px 24px repeat-x;
 mask:linear-gradient(#000,#000) top/100% calc(100% - 22px) no-repeat,var(--wave) bottom/64px 24px repeat-x}
.olm-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.olm-chip{display:block;margin-top:10px;font:700 13px var(--b);color:var(--melo)}
.olm-card{display:block}
.olm-card .olm-ph{aspect-ratio:4/5}
.olm-card h3{font:400 21px/1.15 var(--d);margin-top:4px;text-wrap:balance}
/* portada */
.olm-hero{position:relative;min-height:540px;display:flex;flex-direction:column;justify-content:flex-end;padding-block:0 72px}
.olm-hero .olm-ph,.olm-cathead .olm-ph{position:absolute;inset:0;z-index:0}
.olm-hero .olm-ph::after,.olm-cathead .olm-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,22,88,.35),rgba(14,22,88,.2) 40%,rgba(14,22,88,.7))}
.olm-hero>*:not(.olm-ph){position:relative;z-index:1}
.olm-mark{font:400 clamp(52px,14vw,180px)/.85 var(--d);letter-spacing:-.04em;display:flex;flex-wrap:wrap;text-transform:lowercase;margin:0}
.olm-mark span{display:inline-block;animation:olmup .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*60ms)}
@keyframes olmup{from{transform:translateY(60%);opacity:0}to{transform:none;opacity:1}}
.olm-slogan{font:600 20px var(--b);color:var(--melo);margin:10px 0 26px;background:var(--noche);padding:4px 12px;width:fit-content}
.olm-hero h1{font:400 clamp(28px,4.4vw,56px)/1.05 var(--d);max-width:16em;background:var(--noche);padding:14px 18px;width:fit-content;max-width:100%}
.olm-hero .olm-meta{margin-top:12px;font:600 15px var(--b);background:var(--melo);color:var(--noche);width:fit-content;padding:3px 10px}
.olm-sec{padding-block:48px}
.olm-sec h2,.olm-rel h2{font:400 clamp(34px,5vw,60px)/1 var(--d);margin-bottom:28px;text-transform:lowercase}
.olm-wavy{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;align-items:start}
.olm-wavy>*:nth-child(4n+2){margin-top:34px}.olm-wavy>*:nth-child(4n+3){margin-top:56px}.olm-wavy>*:nth-child(4n+4){margin-top:34px}
.olm-light{background:var(--melo);color:var(--noche)}.olm-light .olm-chip{color:var(--ultra)}
.olm-band{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2.2fr);gap:34px;align-items:start;content-visibility:auto;contain-intrinsic-size:auto 520px}
.olm-band h2{font:400 clamp(40px,6vw,84px)/.9 var(--d);margin:0;text-transform:lowercase;overflow-wrap:anywhere}
.olm-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.olm-row>*:nth-child(2){margin-top:30px}
.olm-more{display:inline-block;margin-top:18px;font:700 16px var(--b);text-decoration:underline;text-underline-offset:.25em}
.olm-foot{padding-block:44px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;background:var(--noche);font:400 15px var(--b);color:#D5D8FA}
.olm-foot .olm-logo{color:#fff;font-size:34px;margin-bottom:8px}
.olm-foot nav{display:flex;gap:6px 20px;flex-wrap:wrap}
/* categoria */
.olm-cathead{position:relative;min-height:320px;display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap;padding-block:0 64px}
.olm-cathead h1{position:relative;z-index:1;font:400 clamp(56px,13vw,170px)/.85 var(--d);letter-spacing:-.04em;text-transform:lowercase;overflow-wrap:anywhere}
.olm-cathead p{position:relative;z-index:1;font:600 18px var(--b);color:var(--melo);padding-bottom:12px;max-width:34em}
.olm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 24px;align-items:start}
.olm-grid>*:nth-child(3n+2){margin-top:40px}
.olm-pag{display:flex;gap:10px;flex-wrap:wrap;margin-top:40px;font:700 16px var(--b)}
.olm-pag a,.olm-pag span{padding:6px 14px;background:var(--noche);color:#fff}.olm-pag .current{background:var(--melo);color:var(--noche)}
/* entrada */
.olm-crumbs{font:600 15px var(--b);color:var(--melo);padding-block:6px 20px}
.olm-crumbs a{text-decoration:underline;text-underline-offset:.2em}
.olm-arthead{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center;padding-bottom:64px}
.olm-arthead h1{font:400 clamp(32px,5vw,64px)/1.04 var(--d);text-wrap:balance;overflow-wrap:anywhere}
.olm-by{margin-top:16px;font:600 16px var(--b);color:var(--melo)}
.olm-arthead .olm-ph{aspect-ratio:5/4}
.olm-body{background:#fff;color:var(--noche);padding-block:56px}
.olm-read{display:grid;grid-template-columns:200px minmax(0,64ch);gap:48px;justify-content:center}
.olm-read.olm-solo{grid-template-columns:minmax(0,64ch)}
.olm-toc{position:sticky;top:20px;align-self:start;font:600 15px/1.4 var(--b)}
.olm-toc b{display:block;font:400 22px var(--d);margin-bottom:8px;text-transform:lowercase}
.olm-toc a{display:block;padding:5px 0;color:var(--ultra);text-decoration:underline;text-underline-offset:.2em}
.olm-txt h2{font:400 32px/1.1 var(--d);margin:36px 0 10px;color:var(--ultra);scroll-margin-top:20px}
.olm-txt h3{font:400 24px/1.15 var(--d);margin:28px 0 8px;color:var(--ultra)}
.olm-txt p,.olm-txt ul,.olm-txt ol{margin-bottom:16px;font-size:18px;line-height:1.65}
.olm-txt ul{list-style:disc;padding-left:1.3em}.olm-txt ol{padding-left:1.4em}
.olm-txt a{color:var(--ultra);text-decoration:underline;text-underline-offset:.2em}
.olm-txt img{display:block;margin:20px 0}
.olm-txt figure{margin:20px 0}.olm-txt figcaption{font-size:14px;color:var(--gris)}
.olm-txt table{border-collapse:collapse;display:block;overflow-x:auto;max-width:100%}.olm-txt td,.olm-txt th{border:1px solid #C9CDF0;padding:8px 12px}
.olm-txt blockquote{margin:20px 0;padding:4px 0 4px 18px;border-left:6px solid var(--melo);font-size:19px}
.olm-share{margin-top:30px;display:flex;gap:10px;flex-wrap:wrap;font:700 15px var(--b)}
.olm-share a,.olm-share button{background:var(--ultra);color:#fff;padding:9px 16px;border:0;font:inherit;cursor:pointer}
.olm-share a:hover,.olm-share button:hover{background:var(--noche);text-decoration:none}
.olm-rel{background:var(--hielo);color:var(--noche);padding-block:44px}
.olm-rel h2{font-size:clamp(30px,4vw,42px)}
.olm-rel .olm-chip{color:var(--ultra)}
.olm-rel .olm-wavy{grid-template-columns:repeat(3,minmax(0,1fr))}
.olm-rel .olm-wavy>*:nth-child(n){margin-top:0}.olm-rel .olm-wavy>*:nth-child(2){margin-top:34px}
/* sobre y contacto */
.olm-about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.olm-about .olm-t{padding:56px clamp(16px,4vw,56px) 56px max(var(--gl),calc((100vw - 1240px)/2 + 56px))}
.olm-about h1,.olm-contact h1,.olm-page h1{font:400 clamp(40px,6vw,80px)/.95 var(--d);margin-bottom:22px;text-transform:lowercase;overflow-wrap:anywhere}
.olm-about p{font-size:18px;margin-bottom:14px;max-width:34em}
.olm-about .olm-ph{min-height:420px}
.olm-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding-block:40px}
.olm-four .olm-ph{aspect-ratio:1/1;margin-bottom:10px}.olm-four h3{font:400 24px var(--d);text-transform:lowercase}.olm-four p{font-size:15px;color:#DADDFB}
.olm-contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:40px;padding-block:56px;align-items:start}
.olm-contact h1{font-size:clamp(44px,7vw,100px)}
.olm-mail{font:600 20px var(--b);color:var(--melo);margin-top:18px;overflow-wrap:anywhere}
.olm-form{background:var(--melo);color:var(--noche);padding:28px;display:grid;gap:14px}
.olm-form label{font:700 15px var(--b);display:grid;gap:5px}
.olm-form input,.olm-form select,.olm-form textarea{font:400 17px var(--b);padding:11px 12px;border:2px solid var(--noche);background:#fff;color:var(--noche);width:100%;border-radius:0}
.olm-form textarea{min-height:130px}
.olm-btn{background:var(--ultra);color:#fff;border:0;font:400 20px var(--d);padding:14px 22px;cursor:pointer;width:fit-content;border-radius:0}
.olm-btn:hover{background:var(--noche)}
.olm-ok,.olm-bad{padding:12px 14px;font:700 16px var(--b);background:#fff}.olm-ok{color:var(--noche);border-left:8px solid var(--ultra)}.olm-bad{color:var(--err);border-left:8px solid var(--err)}
.olm-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.olm-page{background:#fff;color:var(--noche);padding-block:56px}
.olm-page .olm-txt{max-width:64ch;margin-inline:auto}
.olm-page h1{color:var(--ultra);max-width:16em;margin-inline:auto;display:block;max-width:64ch}
.olm-404{padding-block:90px;min-height:60vh}
.olm-404 h1{font:400 clamp(60px,14vw,180px)/.85 var(--d);text-transform:lowercase}
.olm-404 p{font-size:20px;margin:18px 0 26px;color:var(--melo)}

/* ajustes de accesibilidad */
.olm-body,.olm-page,.olm-rel,.olm-light,.olm-form{--foco:var(--ultra)}
html{scroll-padding-bottom:140px}
.olm-foot p a{text-decoration:underline;text-underline-offset:.2em}
/* cookies */
#olm-ck{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--noche);color:#fff;padding:18px var(--gr) calc(18px + env(safe-area-inset-bottom,0px)) var(--gl);display:flex;gap:16px 28px;flex-wrap:wrap;align-items:center;justify-content:space-between;box-shadow:0 -4px 0 var(--melo)}
#olm-ck[hidden]{display:none}
#olm-ck p{font-size:15px;max-width:48em;flex:1 1 300px}#olm-ck a{text-decoration:underline;color:var(--melo)}
#olm-ck div{display:flex;gap:10px;flex-wrap:wrap}
#olm-ck button{font:400 17px var(--d);padding:10px 18px;border:2px solid var(--melo);background:var(--melo);color:var(--noche);cursor:pointer}
#olm-ck button.no{background:transparent;color:var(--melo)}
@media(max-width:860px){
 .olm-wavy,.olm-rel .olm-wavy{grid-template-columns:repeat(2,minmax(0,1fr))}.olm-wavy>*:nth-child(n){margin-top:0}.olm-wavy>*:nth-child(even){margin-top:34px}
 .olm-band,.olm-arthead,.olm-read,.olm-about,.olm-contact{grid-template-columns:minmax(0,1fr)}
 .olm-row{grid-template-columns:repeat(2,minmax(0,1fr))}.olm-row>*:nth-child(3){display:none}
 .olm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.olm-grid>*:nth-child(n){margin-top:0}.olm-grid>*:nth-child(even){margin-top:34px}
 .olm-toc{position:static}.olm-four{grid-template-columns:repeat(2,minmax(0,1fr))}
 .olm-about .olm-ph{min-height:260px;order:-1}.olm-about .olm-t{padding:40px var(--gr) 40px var(--gl)}
 .olm-hero{min-height:440px}
}
@media(max-width:520px){
 .olm-wavy,.olm-grid,.olm-rel .olm-wavy{grid-template-columns:minmax(0,1fr)}
 .olm-wavy>*:nth-child(n),.olm-grid>*:nth-child(n){margin-top:0}.olm-wavy>*:nth-child(even),.olm-grid>*:nth-child(even){margin-left:28px}
 .olm-card .olm-ph{aspect-ratio:16/10}.olm-row{grid-template-columns:minmax(0,1fr)}.olm-row>*:nth-child(n){margin-top:0;display:block}.olm-row>*:nth-child(even){margin-left:28px}
 .olm-form{padding:18px}
}
@media(prefers-reduced-motion:reduce){.olm-mark span{animation:none}}
