@charset "utf-8";

/* Based on MiamiMD checkout CSS — inner.css
   Swapped brand color #00aeef → #6A3D5E
   Swapped font 'Fakt Pro' → system stack
   Added Stripe element + CTA button styles */

/*----------------
RESET CSS
-----------------*/

body {
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
	padding:0;
	background:#fff;
	color:#000000;
	text-align:center;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-weight: 300;
}

div, ul, h1, h2, h3, h4, h5, li, p, img, form, input, textarea {margin:0;padding:0;}
header, section, footer, aside, nav, main, article, figure {display: block;}
table, tr, td {border:0;}
a{outline: none; color:inherit; text-decoration:none;}
a:hover {}
img {border:none;}
li {list-style:none;}
*{box-sizing:border-box;}
.img-full{max-width:100%;}

.clearall{
	clear:both;
	font-size:1px;
	line-height:1px;
	height:1px;
}

.forMob{display:none;}
.forTab{display:none;}
.forDesk{display:block;}
.hidden{display:none !important;}

/*-----------------------
MAIN CSS START
------------------------*/

.container {
	width:1170px;
	margin: 0 auto;
	padding: 0;
	position: relative;
}

/*--------------------------
BRANDED BANNER (header)
---------------------------*/

.branded-banner{
	width:100%;
	background:#6A3D5E;
	padding:18px 20px 14px;
}

.banner-inner{
	max-width:1004px;
	margin:0 auto;
	text-align:center;
}

.banner-logo{
	height:28px;
	margin:0 0 6px;
	filter:brightness(0) invert(1);
}

.banner-headline{
	font-size:24px;
	line-height:32px;
	font-weight:700;
	color:#fff;
	margin:0 0 6px;
	letter-spacing:0.2px;
}

.banner-contact{
	font-size:13px;
	color:rgba(255,255,255,0.7);
}

.banner-contact a{
	color:#fff;
	text-decoration:underline;
	font-weight:500;
}

/*--------------------------
TRUST STRIP (below header)
---------------------------*/

.trust-strip{
	width:100%;
	background:#f5f0ed;
	border-bottom:1px solid #e0d6cf;
	padding:10px 20px;
}

.trust-strip-inner{
	max-width:1004px;
	margin:0 auto;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:6px 20px;
}

.trust-strip-item{
	display:flex;
	align-items:center;
	gap:6px;
	font-size:15px;
	font-weight:700;
	color:#000;
	white-space:nowrap;
}

.trust-strip-note-wrap{
	width:100%;
	padding:24px 20px;
	text-align:center;
}

.trust-strip-note{
	font-size:18px;
	font-style:normal;
	color:#333;
	margin:0;
	line-height:1.5;
}

.inr-stp{
	margin:30px 0 0;
}

.chk-cont{
	float:left;
	width:100%;
}

/*--------------------------
CHECKOUT INNER (the box)
---------------------------*/

.checkout-inr{
	display:inline-block;
	vertical-align:top;
	max-width:1004px;
	box-shadow:0 0 10px 0 rgba(0,0,0,0.1);
	margin:30px 0;
	border-radius:5px;
	padding:15px 20px;
}

.chk-inr-lft{
	width:60%;
	float:left;
	position:relative;
	z-index:999;
}

/*--------------------------
LEFT SIDE: FORM
---------------------------*/

.frm-cont{
	float:left;
	width:100%;
	background:#fff;
}

.frm-hdg{
	float:left;
	width:100%;
	text-align:left;
	padding:0 0 10px;
	position:relative;
	border-bottom:2px solid #dfdfdf;
}

.frm-hdg h3{
	font-size:30px;
	line-height:36px;
	color:#000;
	font-weight:600;
	float:left;
	width:100%;
}

.frm-hdg small{
	font-size:18px;
	line-height:24px;
	color:#000;
	float:left;
	font-weight:500;
}

.frm-hdg p{
	position:absolute;
	right:20px;
	top:8px;
	background:#6A3D5E;
	font-size:20px;
	line-height:24px;
	color:#fff;
	padding:10px 20px 10px 25px;
	font-weight:500;
}

.frm-hdg p::before{
	content:'';
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	border-top:23px solid transparent;
	border-bottom:23px solid transparent;
	border-left:15px solid #fff;
	width:0;
}

.fl{float:left;}
.fr{float:right;}
.half{width:48%;}
.full{width:100%;}

.frm-inr{
	display:inline-block;
	width:100%;
	margin:10px 0 0;
}

.frm-elem{margin:6px 0;}

.frm-inr label{
	width:100%;
	font-size:18px;
	line-height:24px;
	color:#333;
	float:left;
	margin-bottom:5px;
	text-align:left;
	font-weight:400;
}

.frm-inr input[type="text"],
.frm-inr input[type="email"],
.frm-inr input[type="tel"],
.frm-inr select{
	width:100%;
	float:left;
	border:1px solid #c4c4c4;
	padding:12px 15px;
	-webkit-appearance:none;
	font-size:16px;
	line-height: 1.2;
	font-family: inherit;
	border-radius:3px;
	outline:none;
}

.frm-inr select{
	background:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23666' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 94% center no-repeat #fff;
	padding: 0px 15px;
	font-size:15px;
	line-height: 44px;
	height: 44px;
	appearance:none;
}

.frm-inr input::placeholder{color:#878787;}

.frm-inr input:focus,
.frm-inr select:focus{
	border-color:#6A3D5E;
}

/* Shipping estimate */
.usps-txt-bg{
	float:left;
	width:48%;
	padding:10px 0;
	text-align:left;
}

.usps-txt{
	font-size:16px;
	line-height:20px;
	color:#333;
	position:relative;
	display:inline-block;
	vertical-align:top;
	padding-left:60px;
	text-align:left;
	margin-top:28px;
	margin-left:20px;
	font-weight:500;
}

.usps-txt .usps-img{
	position:absolute;
	left:0;
	top:5px;
	padding-right:10px;
}

.usps-txt span{color:#ff0000;}

/*--------------------------
EXPRESS CHECKOUT
---------------------------*/

.express-sec{
	float:left;
	width:100%;
	margin-bottom:5px;
}

#express-checkout-element{min-height:48px;}

.divider{
	display:flex;
	align-items:center;
	gap:14px;
	margin:8px 0 15px;
	color:#999;
	font-size:13px;
	float:left;
	width:100%;
}

.divider::before,
.divider::after{
	content:'';
	flex:1;
	height:1px;
	background:#ddd;
}

/*--------------------------
PAYMENT SECTION
---------------------------*/

.pmt-summary{
	float:left;
	width:100%;
	background:#f8f8f8;
	border:1px solid #e0e0e0;
	padding:14px 16px;
	margin:15px 0;
	text-align:left;
}

.pmt-label{
	font-size:15px;
	font-weight:700;
	color:#000;
	margin-bottom:6px;
}

.pmt-row{
	display:flex;
	justify-content:space-between;
	font-size:15px;
	color:#333;
}

#payment-element{
	min-height:100px;
	float:left;
	width:100%;
}

/* ORDER SUMMARY INLINE (below payment) */
.order-sum-inline{
	float:left;
	width:100%;
	border:1px solid #e0e0e0;
	padding:15px;
	margin:15px 0;
}

.order-sum-inline .prd-prc-det{
	margin:0;
}

.order-sum-inline .total-tr td{
	border-top:2px solid #333;
	padding-top:10px;
	font-size:18px;
}

.ot-note{
	font-size:13px;
	color:#666;
	text-align:center;
	margin-top:12px;
}

/*--------------------------
CTA BUTTON (MiamiMD style)
---------------------------*/

.checkout-btn-wrap{
	float:left;
	width:100%;
	position:relative;
	padding:0;
	padding-right:65px;
	background:linear-gradient(135deg, #C8956C 0%, #D9A87D 50%, #C8956C 100%);
	color:#fff;
	border:none;
	border-radius:5px;
	font-family:inherit;
	font-size:24px;
	font-weight:600;
	cursor:pointer;
	margin:15px 0 0;
	letter-spacing:0.5px;
	height:62px;
	line-height:62px;
	text-align:center;
	overflow:hidden;
}

.checkout-btn-text{
	display:block;
}

.btn-arw{
	position:absolute;
	right:0;
	top:0;
	height:100%;
	width:60px;
	background:rgba(0,0,0,0.1);
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:18px;
}

.checkout-btn-wrap:hover{
	background:linear-gradient(135deg, #B5804E 0%, #C8956C 50%, #B5804E 100%);
}

.checkout-btn-wrap:hover .btn-arw{
	background:rgba(0,0,0,0.12);
}

.checkout-btn-wrap:disabled{
	background:linear-gradient(135deg, #C8956C 0%, #D9A87D 50%, #C8956C 100%);
	opacity:0.6;
	cursor:not-allowed;
}

.spinner{
	display:inline-block;
	width:22px;
	height:22px;
	border:2.5px solid rgba(255,255,255,0.3);
	border-top-color:#fff;
	border-radius:50%;
	animation:spin 0.6s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

/* Error */
.error-message{
	float:left;
	width:100%;
	margin-top:12px;
	padding:12px 14px;
	background:#fef2f2;
	border:1px solid #fecaca;
	border-radius:3px;
	color:#991b1b;
	font-size:14px;
	text-align:center;
}

/* Step 1 CTA (MiamiMD image button) */
.checkout-btn{
	margin:15px 0 0;
	outline:none;
	border:none;
	max-width:100%;
	float:left;
	cursor:pointer;
}

/* Security badges image */
.secur-img{
	float:left;
	margin-top:12px;
	max-width:100%;
}

/*--------------------------
RIGHT SIDE
---------------------------*/

.chk-inr-rgt{
	float:right;
	width:35%;
	padding:15px 0;
}

.odr-sum{
	font-size:26px;
	line-height:30px;
	color:#000;
	font-weight:500;
	text-align:left;
	border-bottom:1px solid #ddd;
	padding-bottom:8px;
	margin:5px 0 20px;
}

.prd-desc{
	float:left;
	width:100%;
	position:relative;
	font-size:18px;
	line-height:24px;
	font-weight:500;
	text-align:left;
	padding-left:130px;
	padding-top:12px;
}

.prd-desc span{
	font-weight:600;
	color:#6A3D5E;
}

.prd-desc img{
	position:absolute;
	left:0;
	top:0;
}

table.prd-prc-det{
	float:left;
	width:100%;
	margin:15px 0;
}

table.prd-prc-det tr td{
	width:50%;
	text-align:left;
	font-size:18px;
	line-height:22px;
	font-weight:400;
	padding:8px 10px 3px;
}

table.prd-prc-det tr:nth-child(4) td{
	background:#e6f4ea;
	color:#1a7a2e;
}

.mny-bck{
	border:1px solid #e0e0e0;
	float:left;
	width:100%;
	padding:20px;
	margin-top:30px;
}

.mny-bck img{
	margin-top:-50px;
}

.mny-bck h3{
	font-size:20px;
	line-height:24px;
	font-weight:600;
	color:#051c3c;
	margin:10px 0;
}

.mny-bck p{
	font-size:18px;
	line-height:24px;
	text-align:left;
}

/*===========testimonial===========*/

.checkout-testimonial{
	background:#fff;
	border:1px solid #E8E2DD;
	border-radius:12px;
	overflow:hidden;
	margin-top:20px;
}

.testimonial-photo{
	width:100%;
	height:auto;
	display:block;
}

/*===========footer===========*/

.footer{
	float: left;
	width: 100%;
	padding:50px 0;
	border-top:1px solid #ddd;
}

.logo-btm{
	margin-bottom:10px;
}

.ftr-btm{
	float:left;
	width:100%;
	padding:5px 0;
}

.ftr-txt2{
	display:inline-block;
	vertical-align:middle;
	color: #727272;
	font-size: 16px;
	line-height: 20px;
	margin-top:5px;
}

.f-p1{
	font-size:14px;
	color:#888;
	margin-top:5px;
}

.f-p1 a{
	color:#888;
	text-decoration:underline;
}

/*--------------------------
MOBILE SUMMARY (from MiamiMD)
---------------------------*/

.proDetails h2 {
	padding: 10px;
	border-bottom: 1px solid #fff;
	font-size: 22px;
	line-height: 30px;
	font-weight: bold;
	color: #fff;
	background: #6A3D5E;
	text-align: left;
	margin-bottom:15px;
	cursor:pointer;
}

.proDetails h2 p{
	float:right;
	font-weight:400;
	margin-right:15px;
	position:static;
	background:none;
	font-size:inherit;
	line-height:inherit;
	color:inherit;
	padding:0;
}

.proDetails h2 p::before{display:none;}

.proDetails h2 span.togle-btn{float:right; width:10px;}


/*==========================
RESPONSIVE
==========================*/

@media only screen and (max-width:1186px){
	.container{ width:1004px;}
}

@media only screen and (max-width:1021px){
	.container{ width:750px;}
	.forDesk{display:none;}
	.forTab{ display:block;}
	.checkout-inr{padding:15px 10px;}
	.chk-inr-lft{width:62%;}
	.frm-hdg h3 {font-size: 26px; line-height: 30px;}
	.frm-hdg p {
		font-size: 18px;
		line-height: 22px;
		padding: 10px 10px 10px 25px;
		right: 10px;
	}
	.frm-hdg small {
		font-size: 14px;
		line-height: 20px;
	}
	.usps-txt-bg{width:100%;}
	.usps-txt{margin-top:8px; margin-left:8px;}
	.prd-desc{padding-left:115px;}
}

@media only screen and (max-width:767px){
	.container{ width:100%; max-width:600px; padding:0 10px;}
	.forDesk,.hide-mob{ display:none;}
	.forTab{ display:none;}
	.forMob{ display:block;}

	.branded-banner{padding:18px 14px 14px;}
	.banner-headline{font-size:24px; line-height:30px; margin-bottom:8px;}
	.banner-contact{font-size:14px;}
	.trust-strip{padding:12px 14px;}
	.trust-strip-inner{display:grid; grid-template-columns:1fr 1fr; gap:8px 0; justify-items:center;}
	.trust-strip-inner .trust-strip-item:last-child{grid-column:1 / -1;}
	.trust-strip-item{font-size:15px; font-weight:700; gap:5px;}
	.trust-strip-item svg{width:15px; height:15px;}
	.trust-strip-note-wrap{padding:16px 14px 12px;}
	.trust-strip-note{font-size:17px; line-height:1.4; color:#000; font-weight:500;}

	.checkout-inr{max-width:100%; margin:15px 0; padding:0; box-shadow:none;}
	.chk-inr-lft{width:100%;}

	.frm-inr{width:100%; padding:0;}
	.frm-hdg h3{font-size:20px; line-height:24px; letter-spacing:1px;}
	.frm-hdg p{top:2px;}
	.frm-hdg small{display:none;}
	.frm-elem{width:100% !important;}

	.usps-txt-bg{background:none; padding:0; width:100%;}
	.usps-txt span{display:block;}
	.usps-txt .usps-img{top:2px;}

	.chk-inr-rgt{width:100%; padding:0;}
	table.prd-prc-det{padding-bottom:10px; border-bottom:1px solid #ddd;}

	.mny-bck{margin-top:45px;}
	.prd-desc{padding-left:125px;}
	.prd-desc img{padding-left:10px;}

	.footer{padding:10px 0;}
	.logo-btm{width:140px; margin-top:10px;}
	.ftr-txt2{width:100%; margin-top:0;}

	/* CTA on mobile — keep full size like MiamiMD */
	.checkout-btn-wrap{
		font-size:22px;
		height:58px;
		line-height:58px;
		padding-right:55px;
	}
	.btn-arw{width:50px;}
}

@media (max-width: 479px){
	.usps-txt{ margin-bottom: 8px;}
}

.label-checkbox{
	float:left;
	width:100%;
	font-size:13px;
	line-height:18px;
	color:#666;
	text-align:left;
	margin:10px 0;
	padding-left:0;
}

.label-checkbox a{
	text-decoration:underline !important;
	color:#6A3D5E;
}
