*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}ul[role=list],ol[role=list]{list-style:none}html,html:focus-within{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}a{text-decoration:none}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}@media(prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}:root{--clr-cyan-900: #0e8784;--clr-cyan-100: #65d2cf;--clr-grey-900: #2c343e;--clr-grey-400: #848990;--clr-orange-100: #fdd6ba;--clr-cream-400: #f4f2eb;--clr-cream-100: #fefcf6;--ff-france: "Fraunces", serif;--ff-barlow: "Barlow", serif}header{display:flex;align-items:center;justify-content:space-between;position:relative;width:min(90%,1400px);margin-inline:auto}header .logo{width:50%}@media screen and (min-width: 768px){header .logo{width:auto}}header .hamburger__menu{position:absolute;right:5%;cursor:pointer}header .hamburger__menu .hamburger{position:absolute}header .hamburger__menu .close__menu{opacity:0}@media screen and (min-width: 768px){header .hamburger__menu{display:none}}header nav{padding-block:2rem}header nav .nav__menu{display:grid;align-items:center;justify-content:center;gap:1rem;background-color:#fff;width:90%;position:absolute;left:5%;top:0;padding-block:1rem;transform:translateY(-150%);transition:transform 300ms ease-in-out;box-shadow:10px 1px 50px 70px #fff}@media screen and (min-width: 768px){header nav .nav__menu{display:flex;width:auto;position:unset;padding:unset;background-color:unset;transform:translateY(5px);box-shadow:none}}header nav .nav__item{text-align:center;list-style:none}header nav .nav__link{color:rgba(0,0,0,.8);font-family:var(--ff-barlow);text-decoration:none}header nav .nav__link:hover{color:#000;font-weight:600;text-decoration:2px solid underline var(--clr-cyan-900)}header nav .nav__menu.active{transform:translateY(70%)}header .hamburger__menu .close__menu.active{opacity:1;z-index:999}header .hamburger__menu>.hamburger.active{opacity:0}main{display:grid;gap:5rem}.heroSection{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.5rem;color:#fff;background-image:url(../assets/plan/mobile/image-hero-blackcup.jpg);background-size:100%;background-repeat:no-repeat;padding-block:2rem;margin-inline:auto;border-radius:10px;aspect-ratio:2;width:min(95%,1400px)}.heroSection h1{font-size:clamp(2rem,5vw + .5rem,5rem);font-family:var(--ff-france);width:min(90%,600px);line-height:1.2}.heroSection p{font-size:clamp(1.2rem,2vw + .5rem,1.5rem);font-family:var(--ff-barlow);width:min(90%,600px);color:#fff;font-weight:700}.heroSection .create-plan__btn{padding:.5em 1em;border:none;border-radius:5px;color:#fff;background-color:var(--clr-cyan-900);font-size:clamp(1rem,1vw + .5rem,2rem);font-family:var(--ff-france);font-weight:600;cursor:pointer;transition:300ms ease-in}.heroSection .create-plan__btn:hover{background-color:var(--clr-cyan-100);color:var(--clr-grey-900)}@media screen and (min-width: 768px){.heroSection{justify-content:center;align-items:start;text-align:start;padding-block:unset;padding-inline-start:2rem;background-image:url(../assets/plan/tablet/image-hero-blackcup.jpg)}}@media screen and (min-width: 1024px){.heroSection{background-image:url(../assets/plan/desktop/image-hero-blackcup.jpg);aspect-ratio:3}}.howItWorks{display:grid;gap:3rem;justify-items:center;padding-inline:1.5rem;background-color:var(--clr-grey-900);padding-block:2rem;border-radius:10px;width:min(95%,1400px);margin-inline:auto}.howItWorks .planCreationProcess{display:grid;gap:3rem;text-align:center}@media screen and (min-width: 768px){.howItWorks .planCreationProcess{grid-template-columns:repeat(3, 1fr);align-items:flex-start;text-align:start}}@media screen and (min-width: 768px){.howItWorks{justify-items:start}}.howItWorks .pickCoffee,.howItWorks .chooseFreq,.howItWorks .receiveCoffee{display:grid;justify-items:center;gap:1rem;color:#fff}.howItWorks .pickCoffee span,.howItWorks .chooseFreq span,.howItWorks .receiveCoffee span{font-size:3rem;font-family:var(--ff-france);color:var(--clr-orange-100)}.howItWorks .pickCoffee h3,.howItWorks .chooseFreq h3,.howItWorks .receiveCoffee h3{font-size:clamp(1.5rem,3vw + .5rem,2rem);font-family:var(--ff-france)}@media screen and (min-width: 768px){.howItWorks .pickCoffee,.howItWorks .chooseFreq,.howItWorks .receiveCoffee{justify-items:start}.howItWorks .pickCoffee p,.howItWorks .chooseFreq p,.howItWorks .receiveCoffee p{font-family:var(--ff-barlow);font-weight:600}}.howItWorks .create-plan__btn{padding:.5em 1em;border:none;border-radius:5px;color:#fff;background-color:var(--clr-cyan-900);font-size:clamp(1rem,1vw + .5rem,2rem);font-family:var(--ff-france);font-weight:600;cursor:pointer;transition:300ms ease-in}.howItWorks .create-plan__btn:hover{background-color:var(--clr-cyan-100);color:var(--clr-grey-900)}.create__plan{display:grid;justify-items:center;width:min(90%,1400px);margin-inline:auto}.create__plan .order__navigation{display:none}.create__plan .order__creation-container{display:grid;gap:3rem}.create__plan .order__accordion-container{display:grid;gap:2rem}.create__plan .order__accordion-container .accordion__control{display:grid;justify-items:center;text-align:center;gap:1.5rem}.create__plan .order__accordion-container .accordion__control .fa-chevron-up{transform:rotate(180deg) translateX(-16px)}.create__plan .order__accordion-container .accordion__control.active .accordion__content{display:grid}.create__plan .order__accordion-container .accordion__control.active .fa-chevron-up{transform:rotate(0deg) translateX(16px)}.create__plan .order__accordion-container .heading{display:flex;justify-content:space-between;align-items:center}.create__plan .order__accordion-container .heading h3{font-size:clamp(1rem,2vw + .5rem,2.5rem)}.create__plan .order__accordion-container .heading .fa-chevron-up{transition:opacity 100ms ease-in;color:var(--clr-cyan-900)}.create__plan .order__accordion-container .accordion__content{display:none;gap:2rem}.create__plan .order__accordion-container .coffee__option{display:grid;gap:.5rem;background-color:var(--clr-cream-400);padding:1.5rem;border-radius:5px;cursor:pointer}.create__plan .order__accordion-container .coffee__option:hover{background-color:var(--clr-orange-100)}.create__plan .order__accordion-container .coffee__option.active{background-color:var(--clr-cyan-900);color:#fff}.create__plan .order__summary{display:grid;justify-items:center;text-align:center;gap:1.5rem;background-color:var(--clr-grey-900);padding:1rem;border-radius:5px}.create__plan .order__summary h5{color:var(--clr-grey-400)}.create__plan .order__summary p{color:#fff}.create__plan .order__summary span{color:var(--clr-cyan-900)}.create__plan .create-plan__btn{padding:.5em 1em;border:none;border-radius:5px;color:#fff;background-color:var(--clr-cyan-900);font-size:clamp(1rem,1vw + .5rem,2rem);font-family:var(--ff-france);font-weight:600;cursor:pointer;transition:300ms ease-in}.create__plan .create-plan__btn:hover{background-color:var(--clr-cyan-100);color:var(--clr-grey-900)}@media screen and (min-width: 768px){.create__plan{grid-template-columns:1fr 1fr;justify-items:flex-start}.create__plan .order__navigation{display:inline-block}.create__plan .nav__item{display:flex;align-items:center;justify-content:start;gap:1rem;color:var(--clr-grey-400);font-family:var(--ff-france);opacity:.6}.create__plan .nav__item:hover{color:var(--clr-cyan-900)}.create__plan .nav__item.active{opacity:1}.create__plan .nav__item.active h2{color:rgba(0,0,0,.8)}.create__plan span{font-size:20px;font-weight:700;color:var(--clr-cyan-900)}.create__plan h2{font-size:20px;cursor:pointer}.create__plan .nav__item:not(:first-child){padding-block-start:1rem}.create__plan .nav__item:not(:last-child){padding-block-end:1rem;border-bottom:1px solid var(--clr-grey-400)}.create__plan .order__accordion-container .accordion__control{justify-items:start;text-align:start}.create__plan .order__accordion-container .accordion__control h3{cursor:pointer}.create__plan .order__accordion-container .accordion__content{align-items:flex-start}.create__plan .order__summary{justify-items:start;text-align:start}}@media screen and (min-width: 1024px){.create__plan .order__accordion-container .accordion__content{grid-template-columns:repeat(3, 1fr);align-items:inherit}.create__plan .create-plan__btn{display:grid;justify-self:flex-end}}dialog{width:min(90ch,600px);text-align:center;padding:2rem 1rem;margin:auto;border:none;border-radius:10px}dialog .close__modal{padding:.5em;border:none;border-radius:5px;color:#fff;background-color:var(--clr-cyan-900);font-family:var(--ff-france);font-size:1rem;font-weight:600;cursor:pointer}dialog>*{margin-block:.5rem}dialog::backdrop{background:rgba(0,0,0,.6)}footer{background-color:var(--clr-grey-900);transform:translateY(5rem)}footer nav{display:grid;justify-items:center;padding-block:3rem;gap:3rem}@media screen and (min-width: 1024px){footer nav{grid-auto-flow:column}}footer .footer__nav{display:grid;justify-items:center;gap:2rem;list-style:none}@media screen and (min-width: 1024px){footer .footer__nav{grid-auto-flow:column}}footer .footer__nav .nav__link{color:rgba(255,255,255,.7);font-family:var(--ff-barlow);text-decoration:none}footer .footer__nav .nav__link:hover{color:#fff;font-weight:600;text-decoration:2px solid underline var(--clr-cyan-900)}footer .social__links{display:flex;justify-content:center;gap:2rem}/*# sourceMappingURL=createPlan.css.map */