*{margin:0;padding:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;font-family:Helvetica,sans-serif;font-weight:400;font-style:normal}body{font-family:Helvetica,sans-serif;letter-spacing:.1rem}p{font-size:clamp(.85rem,5vw,1rem);margin-bottom:.75rem}strong{font-weight:800}.c-dark{color:#82786f !important}.btn{display:inline-block}header .navigation .menu-item.menu-item-btn-outline>a,.btn-outline{border:1px solid #fff;background-color:transparent;color:#fff;padding:15px 20px;font-size:16px;cursor:pointer;border-radius:25px;text-transform:uppercase;font-weight:700;text-decoration:none;transition:background-color .1s,border .1s,color .1s}header .navigation .menu-item.menu-item-btn-outline>a:hover,.btn-outline:hover{background-color:#fff;color:#654030;text-decoration:none}header .navigation .menu-item.menu-item-btn-outline>a{display:inline-block;white-space:nowrap;padding:clamp(10px,.8vw,15px) clamp(14px,1.2vw,20px);font-size:clamp(13px,1.1vw,16px)}header .navigation .menu-item.menu-item-btn-outline{margin-left:5px}.btn-solid{display:inline-block;border:2px solid #ece3da;background-color:#ece3da;color:#827970;padding:15px 40px;margin:20px 0;font-size:.95rem;cursor:pointer;border-radius:25px;text-transform:uppercase;font-weight:700;text-decoration:none;transition:background-color .1s,border .1s,color .1s}.btn-solid:hover{background-color:#827970;border:2px solid #827970;color:#cabfb4}.btn-outline{display:inline-block;border:1px solid #fff;background-color:transparent;color:#82786f;padding:25px 40px;margin:20px;font-size:.95rem;cursor:pointer;border-radius:35px;text-transform:uppercase;font-weight:700;text-decoration:none;transition:background-color .1s,border .1s,color .1s}.btn-outline:hover{background-color:#fff;border:1px solid #82786f;color:#82786f}.main-heading{font-family:"arno-pro",serif;font-size:clamp(2.5rem,5vw,3.5rem);font-weight:500;margin-bottom:20px;color:#654030;line-height:1.25}.sub-heading{font-size:clamp(1rem,5vw,1.25rem);font-weight:500;margin-bottom:30px;color:#cabfb4}.large-heading{font-size:clamp(2rem,5vw,2.75rem);font-weight:600;margin-bottom:20px;color:#223140;line-height:1.25}.small-heading{font-family:"Inter",sans-serif;font-size:clamp(1rem,5vw,1.25rem);font-weight:600;text-transform:uppercase;margin-bottom:10px;letter-spacing:.1rem;color:#cabfb4}.mobile-menu-toggle{justify-self:end;align-self:center}.mobile-menu-toggle .toggle-button{background:#827970;border:none;border-radius:0;padding:0 11px;width:48px;height:48px;display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;cursor:pointer;transition:background-color .3s ease}.mobile-menu-toggle .toggle-button .bar{display:block;width:26px;height:2px;background:#fff;border-radius:0;transition:transform .35s cubic-bezier(.65,0,.35,1),opacity .2s}.mobile-menu-toggle .toggle-button:hover,.mobile-menu-toggle .toggle-button:focus-visible{background:#654030}.mobile-menu-toggle .toggle-button:focus-visible{outline:2px solid #ece3da;outline-offset:3px}nav#mobile[opened] .toggle-button .bar:nth-child(1){transform:translateY(8px) rotate(45deg)}nav#mobile[opened] .toggle-button .bar:nth-child(2){opacity:0}nav#mobile[opened] .toggle-button .bar:nth-child(3){transform:translateY(-8px) rotate(-45deg)}@media (prefers-reduced-motion:reduce){.mobile-menu-toggle .toggle-button,.mobile-menu-toggle .toggle-button .bar{transition:none}}@media (min-width:1025px){nav#mobile,nav#mobile[opened]{right:-500px}}nav#mobile{position:fixed;background-color:#827970;color:#fff;max-width:500px;width:400px;top:0;right:-500px;height:100vh;height:100dvh;overflow-y:auto;overscroll-behavior:contain;z-index:1001;transition:right .3s ease-in-out}nav#mobile[opened]{right:0}nav#mobile .container .top{display:grid;grid-template-columns:1fr;grid-gap:20px;padding:20px}nav#mobile .btn-blue-outline{border-color:#fff}nav#mobile .btn-blue-outline:hover{background-color:#827970;border-color:#827970}nav#mobile .primary-links a{text-decoration:none;color:#fff}nav#mobile .primary-links .link{border-top:1px solid #ccc;padding:15px 0;cursor:pointer;text-transform:uppercase}nav#mobile .primary-links .link:last-child{border-bottom:1px solid #ccc}nav#mobile .primary-links>.link:hover{background:#827970}nav#mobile .primary-links .link .title{width:100%;margin-left:10px;position:relative}nav#mobile .primary-links .link .title:after{position:absolute;content:">";height:1.25rem;width:1.25rem;right:20px;top:0}nav#mobile .primary-links .link:has(.sub-links[opened]){background:#827970}nav#mobile .primary-links .link .title:has(+.sub-links[opened]){font-weight:700}nav#mobile .primary-links .link.menu-item-has-children>.title:after{content:none}nav#mobile .primary-links .link .subnav-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:0 0;border:none;padding:0;color:#fff;font-size:.9rem;cursor:pointer;transition:transform .2s}nav#mobile .primary-links .link .title:has(+.sub-links[opened]) .subnav-toggle{transform:translateY(-50%) rotate(90deg)}nav#mobile .primary-links .link .sub-links{display:none;margin-top:15px;background-color:#827970}nav#mobile .primary-links .link .sub-links .title:after{content:""}nav#mobile .primary-links .link .sub-links a{display:block;padding-left:15px}nav#mobile .primary-links .link .sub-links[opened]{display:block}nav#mobile .primary-links .link .sub-links .link:hover{background:#827970}nav#mobile .secondary-links{padding:30px 20px}nav#mobile .secondary-links .social{display:flex;margin-right:20px;gap:30px;place-items:center}nav#mobile .secondary-links .social-link:hover img{opacity:.8}@media (max-width:450px){nav#mobile{width:100%;max-width:100%}nav#mobile .container .top,nav#mobile .container .bottom{width:100%}}header{position:absolute;top:0;z-index:1000;background:0 0;width:100vw;padding-top:25px}header .container{max-width:1700px;margin:0 auto;padding:20px;display:grid;grid-gap:15px;grid-template-columns:clamp(200px,20vw,300px) minmax(0,1fr) auto;grid-template-areas:"logo spacer navigation";align-items:center}header .logo{grid-area:logo}header .logo img{max-width:100%}header .spacer{grid-area:spacer}header .spacer .line{background:#fff2;height:2px;width:100%;margin-top:15px}header .navigation{display:flex;flex-wrap:wrap;gap:35px;list-style:none;grid-area:navigation;justify-self:end}header .navigation ul.main-navigation{display:flex;align-items:center;flex-wrap:nowrap;list-style:none}header .navigation ul.main-navigation>li{display:inline-block;white-space:nowrap}header .navigation .menu-item a{display:inline-block;text-decoration:none;text-transform:uppercase;color:#fff;font-weight:700;font-size:clamp(.8rem,.9vw,.95rem);background:0 0;border:none;padding:0 clamp(8px,1vw,15px);margin:0;cursor:pointer;outline:none;transition:color .25s}header .navigation .menu-item a:hover{text-decoration:underline}header .navigation .menu-item:first-child a{padding-left:0}header .mobile-menu-toggle{display:none}@media (max-width:1300px){header .container{grid-template-columns:clamp(200px,20vw,300px) 1fr;grid-template-areas:"logo navigation"}header .spacer{display:none}header .navigation .menu-item a{letter-spacing:.05rem}}@media (max-width:1024px){header .container{grid-template-columns:300px 1fr 80px;grid-template-areas:"logo buttons mobile-menu-toggle"}header .spacer,header .navigation{display:none}header .mobile-menu-toggle{display:block;grid-area:mobile-menu-toggle}}@media (max-width:767px){header .container{grid-template-columns:1fr 80px;grid-template-areas:"logo mobile-menu-toggle" "buttons buttons";grid-gap:15px}}@media (max-width:520px){header .buttons{justify-self:center}}footer{border-top:15px solid #433c38;background-image:url("/wp-content/themes/ocskincare/images/footer-bg.webp");background-size:cover;background-position:center;background-repeat:no-repeat;width:100%}footer .container{max-width:1650px;margin:0 auto;padding:80px 15px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;grid-template-areas:"logo col2 col3 col4 contact";gap:clamp(20px,10vw,50px);color:#c8c8c8}footer .logo-column{max-width:400px;display:flex;flex-direction:column;grid-area:logo}footer .logo-column .logo-text{margin:25px 0;line-height:1.75rem;font-size:.9rem}footer .logo-column .copyright{margin-top:auto}footer .menu-block strong{color:#fff;font-weight:600;font-size:1.25rem;display:block;margin-bottom:25px;text-transform:capitalize}footer .menu-block ul{list-style:none;padding:0}footer .menu-block li{padding-bottom:15px;font-size:.95rem}footer .menu-block li a{padding-bottom:0}footer a{display:inline-block;color:#c8c8c8;text-decoration:none;padding-bottom:15px;font-size:.95rem}footer a:hover{text-decoration:underline}footer .column:nth-child(2){grid-area:col2}footer .column:nth-child(3){grid-area:col3}footer .column:nth-child(4){grid-area:col4}footer .column .menu-block{padding-top:1rem}footer .contact-column{max-width:250px;display:flex;flex-direction:column;grid-area:contact}footer .logo-column .logo-text p{margin:0 0 1rem}footer .logo-column .logo-text p:last-child,footer .logo-column .copyright p,footer .contact-block p{margin:0}footer .contact-block p{display:flex;align-items:center;padding-bottom:15px;line-height:1.5rem}footer .contact-block p:before{content:"";width:25px;height:25px;margin-right:15px;background-repeat:no-repeat;background-size:contain;background-position:center;flex-shrink:0}footer .contact-block p:before{background-image:url("/wp-content/themes/ocskincare/images/icon-location.webp")}footer .contact-block p:has(a[href^="tel:"]):before{background-image:url("/wp-content/themes/ocskincare/images/icon-phone.webp")}footer .contact-block p:has(a[href^="mailto:"]):before{background-image:url("/wp-content/themes/ocskincare/images/icon-email.webp")}footer .contact-column .social{margin-top:auto}footer .social .social-link{padding-right:25px}footer .social .social-link:hover{opacity:.8}@media (max-width:1150px){footer .container{grid-template-columns:1fr 1fr 1fr;grid-template-areas:"col2 col3 col4" "logo logo contact"}footer .logo-column{justify-self:start;max-width:100%}}@media (max-width:650px){footer .container{grid-template-columns:1fr 1fr;grid-template-areas:"col2 col3" "col4 contact" "logo logo"}}@media (max-width:475px){footer .container{padding:30px 15px;grid-template-columns:1fr;grid-template-areas:"col2" "col3" "col4" "contact" "logo"}}